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
In tinymce 4 try to do with Promise
tinymce.init({
//some settings
}).then(function(editors) {
//what to do after editors init
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With