I have a page containing one tinymce4 editor instance. I want to initialize this editor with some content, programmatically. I know that I have to call: tinymce.get('editor').setContent('my content');

However I have trouble to do this when tinymce is getting initialized. This question has already been asked: initialize tinyMCE with default content but the answer that was given at that time is not working, at least for tinymce4.

Here is what I have tried:

1st attempt:

    tinymce.init({
      mode: "textareas",
      ...
      setup: function (editor) {
         ...
         editor.setContent('my content');
      }
   });

-> Uncaught TypeError: Cannot read property 'body' of undefined

2nd attempt:

    tinymce.init({
      mode: "textareas",
      ...
    };
    tinymce.get('editor').setContent('my content');

-> Uncaught TypeError: Cannot read property 'setContent' of null (however if I do this when the page containing the tinymce editor has already been loaded, it works).

3rd attempt (SO 12083361 answer):

$(document).ready(function(){
    tinymce.get('editor').setContent('my content');
});

-> Uncaught TypeError: Cannot read property 'setContent' of null

All this fails with tinymce.activeeditor.setContent('my content'); as well.

Where should I place tinymce.get('editor').setContent('my content');in my code to have it working ?

I have a page containing one tinymce4 editor instance. I want to initialize this editor with some content, programmatically. I know that I have to call: tinymce.get('editor').setContent('my content');

However I have trouble to do this when tinymce is getting initialized. This question has already been asked: initialize tinyMCE with default content but the answer that was given at that time is not working, at least for tinymce4.

Here is what I have tried:

1st attempt:

    tinymce.init({
      mode: "textareas",
      ...
      setup: function (editor) {
         ...
         editor.setContent('my content');
      }
   });

-> Uncaught TypeError: Cannot read property 'body' of undefined

2nd attempt:

    tinymce.init({
      mode: "textareas",
      ...
    };
    tinymce.get('editor').setContent('my content');

-> Uncaught TypeError: Cannot read property 'setContent' of null (however if I do this when the page containing the tinymce editor has already been loaded, it works).

3rd attempt (SO 12083361 answer):

$(document).ready(function(){
    tinymce.get('editor').setContent('my content');
});

-> Uncaught TypeError: Cannot read property 'setContent' of null

All this fails with tinymce.activeeditor.setContent('my content'); as well.

Where should I place tinymce.get('editor').setContent('my content');in my code to have it working ?

• javascript
• tinymce
• tinymce-4

2 Answers 2

With version 4 you should do it like this:

tinymce.init({selector:'textarea'});
tinymce.activeEditor.setContent('custom');

Here's a fiddle.

I've used the init_instance_callback, which is fired when the editor is ready to setContent.

var options = { ... };
options.init_instance_callback = function (editor) {
    editor.setContent(initialContent);
};
$("some-selector").tinymce(options);