setContent of an textarea with tinyMCE

Question

I have some textareas and all of them are with tinyMCE.

I would like to set the content of the specific textarea, but I can\'t find how.

I have tryed this:

Answer 1

$('#title').html(selected_article_title);

Make sure that selected_article_title does not contain any html tags.

Answer 2

The following works with tinymce version 4, and doesn't show the editor as a textarea while it's being dragged:

function initializeEditors() {
    var editorContent = {};
    $("#photo-list").sortable({
        start: function (e, ui) {
            $('.attachment-info').each(function () {
                var id = $(this).attr('id');
                editorContent[id] = tinyMCE.get(id).getContent();
            });
        },
        stop: function (e, ui) {
            $('.attachment-info').each(function () {
                var id = $(this).attr('id');
                tinymce.execCommand('mceRemoveEditor', false, id);
                tinymce.execCommand('mceAddEditor', true, id);
                tinyMCE.get(id).setContent(editorContent[id]);
            });
        }
    });
}

Answer 3

Using this

tinyMCE.get('title').setContent(selected_article_title);

won't work. It will set your editor content.

To set the editor source html element (the textarea) you will need to set it directly using

$('#title').html(selected_article_title);

You need to be aware that your editor is not that same as the textarea!

Answer 4

For tinymce version 4,

tinymce.get('title').setContent(selected_article_title);

works just fine - also after initializing the editor.

Answer 5

If you set a content which contains mso tags, (a html content generated from outlook2013, which contains numbered list for example), you loose the list elements. Setting through tinymce.activeEditor.setContent(foo) or first setting textarea content and then initializing tinymce gives the same result, we can not see list elements properly, they are left aligned. But if we set using setContent(foo, { format:'raw' }) wee see the list elements properly. Why?

Answer 6

I have the solution (thans to Thariama who gives me some elements)

To set the content of an textarea using tinyMCE, we heve to fill in the textarea before init the tinyMCE. Also, the response is as follows:

1. Create the textarea:

   <textarea style="width: 95%;" name="Title"  id="title"></textarea>
   

2. Set the content of the textarea:

   $('#title').html(selected_article_title);
   

3. Init the tinyMCE:

   tinyMCE.init({
   // General options
   mode : "specific_textareas",
   theme : "advanced",
   width: "100%",
   plugins : "pagebreak,paste,fullscreen,visualchars",
   
   // Theme options
   theme_advanced_buttons1 : "code,|,bold,italic,underline,|,sub,sup,|,charmap,|,fullscreen,|,bullist,numlist,|,pasteword",
   theme_advanced_buttons2 :"",
   theme_advanced_buttons3 :"",
   theme_advanced_buttons4 :"",
   theme_advanced_toolbar_location : "top",
   theme_advanced_toolbar_align : "left",
   theme_advanced_statusbar_location : "bottom",
   valid_elements : "i,sub,sup",
   invalid_elements : "p, script",
   editor_deselector : "mceOthers"
   });
   

And it's done ! Enjoy.