Udo Udo - 16 days ago 6
HTML Question

multiple tinymce textareas

I use tinymce for a webpage that dynamically generates at least 5 texts.

The configuration I use only works on the first

textarea
unfortunately.

tinyMCE.init({
height : "300",
mode : "exact",
elements : "content",
theme : "simple",
editor_selector : "mceEditor",
...

<textarea class="mceEditor" name="content" rows="15" cols="40">content</textarea>


What's the configuration to enable tinymce editing in all
textarea
's.

Answer

If you're using "exact" mode you'll need to specify the ids of the elements you wish to convert to editors.

function initMCEexact(e){
  tinyMCE.init({
    mode : "exact",
    elements : e,
    ...
  });
}
// add textarea element with id="content" to document
initMCEexact("content");
// add textarea element with id="content2" to document
initMCEexact("content2");
// add textarea element with id="content3" to document
initMCEexact("content3");

Or, you can use the "textarea" mode, which indiscriminately applies the editor to all textareas.

function initMCEall(){
  tinyMCE.init({
    mode : "textareas",
    ...
  });
}
// add all textarea elements to document
initMCEall();

Just remember that if you're creating textareas dynamically, you will need to call tinyMCE.init() after creating the elements, because they need to be existing for tinyMCE to be able to convert them.

Here is the documentation on modes.

Comments