Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

setContent of an textarea with tinyMCE

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:

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

here is my textarea:

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

And here my tinyMCE init:

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"
});

I don't know why this is not working, I am using the exemple from the tinyMCE website http://www.tinymce.com/wiki.php/API3:method.tinymce.Editor.setContent

like image 443
Milos Cuculovic Avatar asked Aug 02 '12 15:08

Milos Cuculovic


People also ask

How do I get content from TinyMCE textarea?

You can do this using the getContent() API method. Let's say you have initialized the editor on a textarea with id=”myTextarea”. This will return the content in the editor marked up as HTML.

How do I save HTML content of TinyMCE into a file?

To save the page, you have to insert TinyMCE in a HTML form and add a submit button. Then you'll have to handle the submitted form with a language like PHP. A call to the file_put_contents() function should do it.

How do I resize TinyMCE?

Clicking and dragging the resize handle in the bottom right-hand corner of the editor.

Does TinyMCE support markdown?

TinyMCE does not currently support a markdown mode with their editor, however I just recently was in the situation where I needed a markdown editor and wanted to use tinymce for it. You will have to add a markdown package to your project. I recommend MarkdownIt, which I found from this list of recommendations.


3 Answers

I think this will solve your problem

it works fine for TinyMCE v:4..

// Sets the HTML contents of the activeEditor editor
tinyMCE.activeEditor.setContent('<span>some</span> html');

// Sets the raw contents of the activeEditor editor
tinyMCE.activeEditor.setContent('<span>some</span> html', {format : 'raw'});

// Sets the content of a specific editor (my_editor in this example)
tinyMCE.get('my_editor').setContent(data); // here my_editor is the id of a specific editor

// Sets the bbcode contents of the activeEditor editor if the bbcode plugin was added
tinyMCE.activeEditor.setContent('[b]some[/b] html', {format : 'bbcode'});

the link for the code is TinyMCE setContent

like image 180
Ryan Monreal Avatar answered Oct 14 '22 03:10

Ryan Monreal


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.

like image 30
Milos Cuculovic Avatar answered Oct 14 '22 02:10

Milos Cuculovic


For tinymce version 4,

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

works just fine - also after initializing the editor.

like image 13
Tom Avatar answered Oct 14 '22 01:10

Tom