So I'm running into this predicament.

<SCRIPT src="../js/tiny_mce/tiny_mce.js"></script>
<SCRIPT type="text/javascript">
   tinyMCE.init({
        mode : "textareas",
        theme : "simple"
   });
</SCRIPT>
<SCRIPT src="../js/admin.js"></script>

The above is called on my PHP page.

I'm then calling

var request = $.ajax(
{
   url:"getEvents.php",
   type:"POST",
   data:{'method':'showevents'},
   dataType:"html"
   }).done(function(msg){
        $('#eventlistbody').html(msg);
   }); 

   setTimeout(
        function(){
            $(".mceSimple").each(function(){
              tinyMCE.execCommand("mceAddControl",false, this.id);
           })
   },2000); 

this loads a bunch of textareas..... the tinyMCE will load on all the text areas the first time it returns..when I click on the reload which runs the above again and returns the text areas they no longer have the tinyMCE attached to them. I'm not sure why it works the first time and not subsequent times.

So I'm running into this predicament.

<SCRIPT src="../js/tiny_mce/tiny_mce.js"></script>
<SCRIPT type="text/javascript">
   tinyMCE.init({
        mode : "textareas",
        theme : "simple"
   });
</SCRIPT>
<SCRIPT src="../js/admin.js"></script>

The above is called on my PHP page.

I'm then calling

var request = $.ajax(
{
   url:"getEvents.php",
   type:"POST",
   data:{'method':'showevents'},
   dataType:"html"
   }).done(function(msg){
        $('#eventlistbody').html(msg);
   }); 

   setTimeout(
        function(){
            $(".mceSimple").each(function(){
              tinyMCE.execCommand("mceAddControl",false, this.id);
           })
   },2000); 

this loads a bunch of textareas..... the tinyMCE will load on all the text areas the first time it returns..when I click on the reload which runs the above again and returns the text areas they no longer have the tinyMCE attached to them. I'm not sure why it works the first time and not subsequent times.

• javascript
• jquery
• ajax
• tinymce

3 Answers 3

You should shut down tinymce correctly before you reload in order to be able to reinitialize a tinymce editor after the reload has been made. This is necessary because tinymce does not like to be dragged around the dom. And initialized editor instances may have one one unique id (using reload will force tinymce to try to initliaze a second editor with the same id - which will fail).

Tinymce3: To shut down an edtor instance use:

tinymce.execCommand('mceRemoveControl',true, editor_id);

To reinitialize use

tinymce.execCommand('mceAddControl',true, editor_id);

Tinymce4: To shut down an edtor instance use:

tinymce.execCommand('mceRemoveEditor',true,editor_id);

To reinitialize use

tinymce.execCommand('mceAddEditor',true,editor_id);

For me tinyMCE.remove(editor_id) worked.

Tinymce4: To shut down an edtor instance use:

tinymce.remove(); 

or indicate one unique id

tinymce.execCommand('mceRemoveEditor',true,editor_id);

To reinitialize use

tinymce.init(conftinymce);

or indicate one unique id

tinymce.execCommand('mceAddEditor',true,editor_id);