Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Having issues with Multiple AJAX refresh and TinyMCE

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.

like image 494
BostonMacOSX Avatar asked Feb 20 '13 02:02

BostonMacOSX


3 Answers

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);
like image 171
Thariama Avatar answered Oct 30 '22 23:10

Thariama


For me tinyMCE.remove(editor_id) worked.

like image 2
Andre Avatar answered Oct 31 '22 00:10

Andre


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);
like image 1
Uriel Acosta Hernández Avatar answered Oct 31 '22 00:10

Uriel Acosta Hernández