aboutsummaryrefslogtreecommitdiff
path: root/sources/samples/old/ajax.html
diff options
context:
space:
mode:
Diffstat (limited to 'sources/samples/old/ajax.html')
-rw-r--r--sources/samples/old/ajax.html85
1 files changed, 85 insertions, 0 deletions
diff --git a/sources/samples/old/ajax.html b/sources/samples/old/ajax.html
new file mode 100644
index 0000000..852a086
--- /dev/null
+++ b/sources/samples/old/ajax.html
@@ -0,0 +1,85 @@
1<!DOCTYPE html>
2<!--
3Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
4For licensing, see LICENSE.md or http://ckeditor.com/license
5-->
6<html>
7<head>
8 <meta charset="utf-8">
9 <title>Ajax &mdash; CKEditor Sample</title>
10 <script src="../../ckeditor.js"></script>
11 <link rel="stylesheet" href="sample.css">
12 <script>
13
14 var editor, html = '';
15
16 function createEditor() {
17 if ( editor )
18 return;
19
20 // Create a new editor inside the <div id="editor">, setting its value to html
21 var config = {};
22 editor = CKEDITOR.appendTo( 'editor', config, html );
23 }
24
25 function removeEditor() {
26 if ( !editor )
27 return;
28
29 // Retrieve the editor contents. In an Ajax application, this data would be
30 // sent to the server or used in any other way.
31 document.getElementById( 'editorcontents' ).innerHTML = html = editor.getData();
32 document.getElementById( 'contents' ).style.display = '';
33
34 // Destroy the editor.
35 editor.destroy();
36 editor = null;
37 }
38
39 </script>
40</head>
41<body>
42 <h1 class="samples">
43 <a href="index.html">CKEditor Samples</a> &raquo; Create and Destroy Editor Instances for Ajax Applications
44 </h1>
45 <div class="warning deprecated">
46 This sample is not maintained anymore. Check out its <a href="http://sdk.ckeditor.com/samples/saveajax.html">brand new version in CKEditor SDK</a>.
47 </div>
48 <div class="description">
49 <p>
50 This sample shows how to create and destroy CKEditor instances on the fly. After the removal of CKEditor the content created inside the editing
51 area will be displayed in a <code>&lt;div&gt;</code> element.
52 </p>
53 <p>
54 For details of how to create this setup check the source code of this sample page
55 for JavaScript code responsible for the creation and destruction of a CKEditor instance.
56 </p>
57 </div>
58 <p>Click the buttons to create and remove a CKEditor instance.</p>
59 <p>
60 <input onclick="createEditor();" type="button" value="Create Editor">
61 <input onclick="removeEditor();" type="button" value="Remove Editor">
62 </p>
63 <!-- This div will hold the editor. -->
64 <div id="editor">
65 </div>
66 <div id="contents" style="display: none">
67 <p>
68 Edited Contents:
69 </p>
70 <!-- This div will be used to display the editor contents. -->
71 <div id="editorcontents">
72 </div>
73 </div>
74 <div id="footer">
75 <hr>
76 <p>
77 CKEditor - The text editor for the Internet - <a class="samples" href="http://ckeditor.com/">http://ckeditor.com</a>
78 </p>
79 <p id="copy">
80 Copyright &copy; 2003-2017, <a class="samples" href="http://cksource.com/">CKSource</a> - Frederico
81 Knabben. All rights reserved.
82 </p>
83 </div>
84</body>
85</html>