How to install content in TinyMCE 4, preferably in $ (document) .ready (); block?

Question

As the name says, I looked at the official documentation, but it does not work; here is my JavaScript code (using jQuery):

$(document).ready(function() { tinymce.init({ element_format: "html", schema: "html4", menubar: false, plugins: 'preview textcolor link code', selector: 'TEXTAREA#rtf', toolbar: 'preview | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | blockquote subscript superscript | code' }); tinymce.activeEditor.setContent($('TEXTAREA#rtf').text()); }); 

• I tried to check tinymce and tinyMCE (got this from Googling) and both of them are objects in order.
• I also tried to check tinymce.activeEditor and tinyMCE.activeEditor, but they turn out to be null !

---

(Cough) Somehow, after I restored everything to the place where I started, it works:

 $(document).ready(function() { tinymce.init({ element_format: "html", menubar: false, plugins: 'preview textcolor link code', schema: "html4", selector: 'TEXTAREA#rtf', toolbar: 'preview | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | blockquote subscript superscript | code' }); }); 

I suspect this came either from the UA cache or from the XSLT result cache, which made the problem; Thanks again for your time!

Answer 1

this is how i implemented it:

 setTimeout(tinyMCE.init({ selector: "textarea.edit_notes", height: editor_height, theme: "modern", menubar: "tools table format view insert edit", force_br_newlines : false, force_p_newlines : false, forced_root_block : '', //plugins: "fullpage", valid_elements : '*[*]', setup: function(ed){ ed.on("init", function(ed) { tinyMCE.get('testeditor').setContent($('#testeditor').val()); tinyMCE.execCommand('mceRepaint'); } ); } }), 50); 

Take a picture

Answer 2

 tinymce.activeEditor.setContent('<span>some</span> html'); 

https://www.tinymce.com/docs/api/tinymce/tinymce.editor/#setcontent

Answer 3

I found a better solution that works anywhere in the code (and is not a hack, unlike the setTimeout trick)

 tinymce.get('tinymce-element-id').on('init',function(e) { e.target.setContent('my custom content'); }); 

Answer 4

This code runs as soon as the document is in a ready state, so the only thing that is possible is to configure the content even before textarea has the content. One question, where and how is the content set in the text box?

Secondly, you can put tinyMCE.init({ .... }); in setTimeOut.

Hope this helps.

Answer 5

I remember doing something like this once, manually adding a textarea value to TinyMCE:

 tinyMCE.init({ ... setup : function(editor) { editor.setContent($('TEXTAREA#rtf').text()); } }); 

The “editor” parameter for the configuration function is an instance of TinyMCE, which is expected to be there. They did not use TinyMCE after a while, but I remember that I had many such problems! You are not alone in finding problems here.

But why not use something like this? http://www.tinymce.com/wiki.php/Configuration3x:editor_selector

 tinyMCE.init({ ... mode : "specific_textareas", editor_selector : "TEXTAREA#rtf" // CSS Selectors }); 

How TinyMCE is used by default. It converts your text fields to TinyMCE instances and stores the value synchronized between the input and TinyMCE