converting.html 2.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <meta http-equiv="X-UA-Compatible" content="IE=10" />
  6. <title>Daum Editor - Demo</title>
  7. <link rel="stylesheet" href="css/editor.css" type="text/css" charset="utf-8"/>
  8. </head>
  9. <body>
  10. <div class="body">
  11. <form name="tx_editor_form" id="tx_editor_form" action="http://posttestserver.com/post.php" method="post"
  12. accept-charset="utf-8">
  13. <textarea name="content" id="content" style="width: 100%; height: 490px;"></textarea>
  14. </form>
  15. </div>
  16. <div>
  17. <button onclick="saveContent()">Submit Content</button>
  18. </div>
  19. <script src="js/editor_loader.js" type="text/javascript" charset="utf-8"></script>
  20. <script src="js/editor_creator.js" type="text/javascript" charset="utf-8"></script>
  21. <script type="text/javascript">
  22. var config = {
  23. initializedId: "",
  24. wrapper: "tx_trex_container",
  25. form: 'tx_editor_form',
  26. txIconPath: "images/icon/editor/",
  27. txDecoPath: "images/deco/contents/",
  28. events: {
  29. preventUnload: false
  30. },
  31. sidebar: {
  32. attachbox: {
  33. show: true
  34. }
  35. }
  36. };
  37. EditorCreator.convert(document.getElementById("content"), 'pages/template/simple.html', function () {
  38. EditorJSLoader.ready(function (Editor) {
  39. new Editor(config);
  40. Editor.modify({
  41. content: '<p>Hello</p>'
  42. });
  43. });
  44. });
  45. </script>
  46. <script type="text/javascript">
  47. function saveContent() {
  48. Editor.save();
  49. }
  50. function validForm(editor) {
  51. var validator = new Trex.Validator();
  52. var content = editor.getContent();
  53. if (!validator.exists(content)) {
  54. alert('Content is empty');
  55. return false;
  56. }
  57. return true;
  58. }
  59. function setForm(editor) {
  60. var i, input;
  61. var form = editor.getForm();
  62. var content = editor.getContent();
  63. var field = document.getElementById("content");
  64. field.value = content;
  65. var images = editor.getAttachments('image');
  66. for (i = 0; i < images.length; i++) {
  67. input = document.createElement('input');
  68. input.type = 'hidden';
  69. input.name = 'attach_image';
  70. input.value = images[i].data.imageurl;
  71. form.createField(input);
  72. }
  73. var files = editor.getAttachments('file');
  74. for (i = 0; i < files.length; i++) {
  75. input = document.createElement('input');
  76. input.type = 'hidden';
  77. input.name = 'attach_file';
  78. input.value = files[i].data.attachurl;
  79. form.createField(input);
  80. }
  81. return true;
  82. }
  83. </script>
  84. </body>
  85. </html>