javascript - Problems with initialize Tinymce -


i set editor on frontend , have problem, how initialize tinymce in case.

my code:

<head> <script src="//cdn.tinymce.com/4/tinymce.min.js"></script> </head> <body>   <a class=pageedit>Редактировать</a> <div id="textwidget" class="textwidget"> lorem ipsum dolor sit amet, consectetur adipisicing elit. obcaecati esse enim facilis quam magnam nihil excepturi ipsa, maxime ducimus sapiente, repudiandae facere mollitia, velit quia dolore doloribus molestiae odit fuga? </div> </body>   /*jquery*/   $(document).ready(function() {        $('a.pageedit').on('click', function() {            $('#textwidget').wrap('<form class="tinymce"><textarea class="tiny" name="page"></textarea></form>');            $(this).unbind('click');           settimeout(function() {              tinit();           },100);       });    });  function tinit() {       tinymce.init({          selector:'textarea.tiny',         height: 600,         plugins: [           'advlist autolink lists link image charmap print preview anchor',           'searchreplace visualblocks code fullscreen',           'insertdatetime media table contextmenu paste code'         ],         toolbar: 'undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',       });        $('form.tinymce').submit(function() {          return false;       });        $('form.tinymce').on('submit', function() {         var page = $(this).serialize();         $.ajax({           type:'post',           url: 'publish.php',           data: page,           success: function(data) {             alert(data);             document.location.href = '';           },           error: function() {             alert('error');           }         });       });  } 

in end, editor loaded, empty inside. how can solve it?

is reproduced here: http://codepen.io/anon/pen/pzeewg

this can done. make sure tinymce source element contains desired content before initializing tinymce. other option set tinymce content after initialization.

  tinymce.init({      selector:'textarea.tiny',     height: 600,     plugins: [       'advlist autolink lists link image charmap print preview anchor',       'searchreplace visualblocks code fullscreen',       'insertdatetime media table contextmenu paste code'     ],     toolbar: 'undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',     setup : function(ed)     {        ed.on('init', function(evt)       {         ed.setcontent($('#textwidget').html());       });     }   });   .... } 

update: on submit do:

$('form.tinymce').on('submit', function() {     //  calls save method on editor instances in collection. can useful when form submitted.     tinymce.triggersave();      .... }); 

Comments

Popular posts from this blog

SVG stroke-linecap doesn't work for circles in Firefox? -

routes - Laravel 4 Wildcard Routing to Different Controllers -

cross browser - XSLT namespace-alias Not Working in Firefox or Chrome -