CODEWITHSUNDEEP
javascripttinymce
pooja
pooja

Reputation: 2432

How to get the content of a Tinymce textarea with JavaScript

i have an array of content then how we get content of Tinymce textarea in javascript

Upvotes: 50

Views: 96237

Answers (11)

cssyphus
cssyphus

Reputation: 40106

For version 4.1.9, this is what worked for me:

$(function(){
  $('button').click(() => {
    const out3 = tinyMCE.get('bobt').getContent(); //*MUST* be an ID, not a class
    alert(out3);
    $('#out').html(out3);
  });
});
<textarea id="bobt" class="tinymce"></textarea>
<div id="outx"><button>Get it</button></div>
<div id="out"></div>

Notes:

  1. .get() requires an ID, not a class
  2. tinymce.get() or tinyMCE.get() both work -- uppercasing the MCE does not matter

Upvotes: 0

Ben Long
Ben Long

Reputation: 383

Use the getContent() method from the TinyMCE API.

Let’s say you have initialized the editor on a textarea with id=”myTextarea”. First access the editor using that same id, then call getContent(). For example:

var myContent = tinymce.get('myTextarea').getContent();

Or, instead of accessing the editor by id, you can access the active editor:

var myContent = tinymce.activeEditor.getContent();

If want to get the TinyMCE content without the HTML tags, you can pass in a parameter to indicate that you want the result in plaintext. For example:

var myContent = tinymce.get('myTextarea').getContent({format: 'text'});

More info and examples here: https://www.tiny.cloud/blog/how-to-get-content-and-set-content-in-tinymce.

Upvotes: 2

Omid Erfanmanesh
Omid Erfanmanesh

Reputation: 616


tinymce.activeEditor.getContent();

Upvotes: 0

Mohamad Hamouday
Mohamad Hamouday

Reputation: 2783

This work for me for version 4 (9.8):

var Content = tinyMCE.editors['Your_ID'].getContent();

Upvotes: 0

jqpress
jqpress

Reputation: 879

I solved it with code:

// Get the HTML contents of the currently active editor
tinyMCE.activeEditor.getContent();

// Get the raw contents of the currently active editor
tinyMCE.activeEditor.getContent({format : 'raw'});

// Get content of a specific editor:
tinyMCE.get('content id').getContent()

the activeEditor is current editor,but i use tinyMCE.get('editor1').getContent() can not get the value of my editor, hope it can help you

Tinymce API: http://www.tinymce.com/wiki.php/API3:method.tinymce.Editor.getContent

Upvotes: 87

Brennan James
Brennan James

Reputation: 452

tinymce.get('editorId').setContent(response.data);

Upvotes: 0

Phil McCarty
Phil McCarty

Reputation: 486

If you are more familiar with (and are using the jquery wrapper), you can also do this using this:

$('#editor1').tinymce().getContent();

Where (editor1) is your selector.

Upvotes: -3

Bence Gajd&#225;n
Bence Gajd&#225;n

Reputation: 612

In my case (v4.3.12), none of the above worked, so I did a workaround:

Html code:

<div id="wrapper">
    <textarea id="editable_container" name="editable_container"></textarea>
</div>

JQuery code:

var iframe = $('#editable_container_ifr');
var editorContent = $('#tinymce[data-id="editable_container"]', iframe.contents()).html();
console.log(editorContent);

Where editable_container is my tinyMCE editor's placeholder textarea, the editable area's iframe id is generated from adding a _ifr postfix to the placeholder's id, and the content-editable container (which contains the formatted text), has an id tinymce with a data-id attribute of the placeholder's id.

Upvotes: 5

CyE
CyE

Reputation: 221

I had the same problem. I have solved using this code:

tinyMCE.get('editor1').getContent();

Source: spocke is the author

Upvotes: 22

Thariama
Thariama

Reputation: 50830

You may use:

tinymce.get(editorid).getContent();

Upvotes: 19

z.eljayyo
z.eljayyo

Reputation: 1289

lets say your mce textarea instance is:

<textarea id="editor1" ....></textarea>

then you get the content as follows:

var content =  tinyMCE.getContent('editor1');

if you mean you have multiple instances of mce editor on one page and you want to get content then try this approach:

var inst, contents = new Object();
for (inst in tinyMCE.editors) {
    if (tinyMCE.editors[inst].getContent)
        contents[inst] = tinyMCE.editors[inst].getContent();
}

the above code adds each editor content into an array

Upvotes: 33

Related Questions