tinyMCE setContent - dynamically (jQuery) added textarea

Question

I have some fields listed on my page, each has a button that creates a textarea that is to be converted to tinyMCE, and the content shall be updated with a string that is from an ajax request. Like this:

$("table td.bio-td").delegate(".btn", "click", function() {
     ...         
     var id = this.id;
     $('#cont').html('<textarea id="mceeditor_'+id'">xyz</textarea>');
     tinymce.EditorManager.execCommand('mceAddControl',true, 'mceeditor_'+id);
     tinymce.activeEditor.setContent(ajax_str);
     ...
});

The code works properly except for one thing: the setContent() line. I get an error in the javascript console, that the activeEditor is null. Somehow tinyMCE cannot find the editor in the DOM? Then how did it convert to tinymce object before?

Answer 1

Try doing:

tinymce.get('your_textarea_id').focus();
tinymce.activeEditor.setContent(ajax_str);

Hope it helps

Answer 2

Easiest way is

tinymce.get('mceeditor_'+id).setContent(ajax_str);