JasonWoof Got questions, comments, patches, etc.? Contact Jason Woofenden
gitweb / ckeditor.git / blobdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side
vanilla ckeditor-3.6.3
[ckeditor.git] / _samples / ajax.html
diff --git a/_samples/ajax.html b/_samples/ajax.html
index d2ce3bd..430971f 100644 (file)
--- a/_samples/ajax.html
+++ b/_samples/ajax.html
@@ -1,41 +1,29 @@
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\r
 <!--\r
-Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.\r
+Copyright (c) 2003-2012, CKSource - Frederico Knabben. All rights reserved.\r
 For licensing, see LICENSE.html or http://ckeditor.com/license\r
 -->\r
 <html xmlns="http://www.w3.org/1999/xhtml">\r
 <head>\r
-       <title>Sample - CKEditor</title>\r
-       <meta content="text/html; charset=utf-8" http-equiv="content-type"/>\r
+       <title>Ajax &mdash; CKEditor Sample</title>\r
+       <meta content="text/html; charset=utf-8" http-equiv="content-type" />\r
        <script type="text/javascript" src="../ckeditor.js"></script>\r
        <script src="sample.js" type="text/javascript"></script>\r
-       <link href="sample.css" rel="stylesheet" type="text/css"/>\r
-       <script id="headscript" type="text/javascript">\r
+       <link href="sample.css" rel="stylesheet" type="text/css" />\r
+       <script type="text/javascript">\r
        //<![CDATA[\r
 \r
-var editor;\r
+var editor, html = '';\r
 \r
 function createEditor()\r
 {\r
        if ( editor )\r
                return;\r
 \r
-       var html = document.getElementById( 'editorcontents' ).innerHTML;\r
 \r
-       // Create a new editor inside the <div id="editor">\r
-       editor = CKEDITOR.appendTo( 'editor' );\r
-       editor.setData( html );\r
-\r
-       // This sample may break here if the ckeditor_basic.js is used. In such case, the following code should be used instead:\r
-       /*\r
-       if ( editor.setData )\r
-               editor.setData( html );\r
-       else\r
-               CKEDITOR.on( 'loaded', function()\r
-                       {\r
-                               editor.setData( html );\r
-                       });\r
-       */\r
+       // Create a new editor inside the <div id="editor">, setting its value to html\r
+       var config = {};\r
+       editor = CKEDITOR.appendTo( 'editor', config, html );\r
 }\r
 \r
 function removeEditor()\r
@@ -45,7 +33,7 @@ function removeEditor()
 \r
        // Retrieve the editor contents. In an Ajax application, this data would be\r
        // sent to the server or used in any other way.\r
-       document.getElementById( 'editorcontents' ).innerHTML = editor.getData();\r
+       document.getElementById( 'editorcontents' ).innerHTML = html = editor.getData();\r
        document.getElementById( 'contents' ).style.display = '';\r
 \r
        // Destroy the editor.\r
@@ -57,9 +45,20 @@ function removeEditor()
        </script>\r
 </head>\r
 <body>\r
-       <h1>\r
-               CKEditor Sample\r
+       <h1 class="samples">\r
+               CKEditor Sample &mdash; Create and Destroy Editor Instances for Ajax Applications\r
        </h1>\r
+       <div class="description">\r
+       <p>\r
+               This sample shows how to create and destroy CKEditor instances on the fly. After the removal of CKEditor the content created inside the editing\r
+               area will be displayed in a <code>&lt;div&gt;</code> element.\r
+       </p>\r
+       <p>\r
+               For details of how to create this setup check the source code of this sample page\r
+               for JavaScript code responsible for the creation and destruction of a CKEditor instance.\r
+       </p>\r
+       </div>\r
+\r
        <!-- This <div> holds alert messages to be display in the sample page. -->\r
        <div id="alerts">\r
                <noscript>\r
@@ -70,25 +69,29 @@ function removeEditor()
                        </p>\r
                </noscript>\r
        </div>\r
-       <!-- This <fieldset> holds the HTML that you will usually find in your\r
-            pages. -->\r
+       <p>Click the buttons to create and remove a CKEditor instance.</p>\r
        <p>\r
-                       <input onclick="createEditor();" type="button" value="Create Editor"/>\r
-                       <input onclick="removeEditor();" type="button" value="Remove Editor"/>\r
-               </p>\r
-               <div id="editor">\r
-               </div>\r
-               <div id="contents" style="display: none">\r
-                       <p>Edited Contents:</p>\r
-                       <div id="editorcontents"/>\r
+               <input onclick="createEditor();" type="button" value="Create Editor" />\r
+               <input onclick="removeEditor();" type="button" value="Remove Editor" />\r
+       </p>\r
+       <!-- This div will hold the editor. -->\r
+       <div id="editor">\r
+       </div>\r
+       <div id="contents" style="display: none">\r
+               <p>\r
+                       Edited Contents:</p>\r
+               <!-- This div will be used to display the editor contents. -->\r
+               <div id="editorcontents">\r
                </div>\r
+       </div>\r
        <div id="footer">\r
-               <hr/>\r
+               <hr />\r
                <p>\r
-                       CKEditor - The text editor for Internet - <a href="http://ckeditor.com/" shape="rect">http://ckeditor.com</a>\r
+                       CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>\r
                </p>\r
                <p id="copy">\r
-                       Copyright © 2003-2009, <a href="http://cksource.com/" shape="rect">CKSource</a> - Frederico Knabben. All rights reserved.\r
+                       Copyright &copy; 2003-2012, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico\r
+                       Knabben. All rights reserved.\r
                </p>\r
        </div>\r
 </body>\r
ckeditor; unchanged from upstream, one commit/tag per release