Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

execute js function after tinymce is loaded

I have a select that onchange trigger a js funtion to show/hide tinymce editor:

<select id="mySelect" onChange="myFuntion()">
<option value="1">Yes</option>
<option value="0">No</option>

Then I have a textarea with tinymce (loaded on page load).

<textarea class="mce" id="myTextarea"></textarea>
<script src="tinymce.js></script> // file with global tinymce.init({ ... });

The js function is like:

<script>    
function myFuntion(){ 
  if( $( '#mySelect' ).val() == '1' ) { tinymce.get( 'myTextarea' ).show(); } 
  else { tinymce.get( 'myTextarea' ).hide(); }
}
$( document ).ready(function() { myFuntion(); }); // show/hide tinymce based on how the mySelect setting is on page load

Everything works great except for the "$( document ).ready(function(){ myFuntion(); });" that throw an error "Uncaught TypeError: Cannot read property 'show' of null", I think its because tinymce is not yet loaded.

There is a way to change the "document ready function" with "when tinymce is loaded > execute myFunction()"

PS: I use tinymce 4, the tinymce.init() is on a external files and used on other pages, so i prefer not to edit this file

EDIT: my actual workaround is to use: setTimeout( function(){ myFunction(); }, 1500 ); but if there is a callback or similiar, for example $(document).on('tinymce:init') will be great

like image 875
ipel Avatar asked Oct 24 '25 00:10

ipel


1 Answers

In tinymce 4 try to do with Promise

tinymce.init({
//some settings
}).then(function(editors) {
   //what to do after editors init
});
like image 90
Rudolf Manusachi Avatar answered Oct 25 '25 14:10

Rudolf Manusachi