TinyMCE 4 : How to get the real HTML content from a page with many DIV inline editors on same page? (save to 1 file)

Question

In my CMS I have many DIVs on one HTML page with inline TinyMCE. Each DIV has it's own instance (#mce_0, and #mce_{randomnumber} )

Every editable DIV is inside one wrapping DIV (not editable) with a specific ID (#MyWrapper).

Everything that is inside #MyWrapper (all the editor DIVs) should be saved to ONE file.

When I use javascript to get the html from inside the #MyWrapper it works well, except that I get the HTML used inside the editor, in stead of the REAL HTML I want to have. For example iframes (YouTube-videos) are made into a example-image in stead of a real iframe.

So, I have then tried to get the HTML code from the editors (same HTML as shown when you click on the "source code" inside the editor).

But I haven't succeeded.

Here is how my existing (working, but not getting the real HTML) script works:

1) Get all HTML content in #MyWrapper

2) Jquery: Add it to a non editable and hidden DIV called #ForSaving , so I can get easy access for saving it

3) Then I have a javascript to save it to file.

Today the task #1 (above) is solved using this:

jQuery("#ForSaving").html(jQuery(".MyWrapper").html());

BUT I should have a solution to get the real HTML from multiple inline editors in DIVs.

I have tried tinymce.get('...'); etc, but I can not seam to get the HTML from multiple editors.

Any help is appreciated. :-)

Addition: I found this by searching for "tinymce multiple instances getcontent": How to get tinyMCE content from more than one text area

Thariama added a reply telling to use this:

for (i=0; i < tinyMCE.editors.length; i++){
    var content = tinyMCE.editors[i].getContent();
    alert('Editor-Id(' + tinyMCE.editors[i].id + '):' + content);
}

However I don't understand how to combine this with :

jQuery("#ForSaving").html(jQuery(".MyWrapper").html());

I am not very good at javascript-coding.

I kindly ask you to help me combine these. Thank you :-)

vico vico · Accepted Answer · 2014-11-03T22:19:24

shouldn't you just use databases for that? pretty sure you are exposing yourself to huge security flaws by allowing saving like that..

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

straight from the website~

// Get the HTML contents of the currently active editor
console.debug(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()

TinyMCE 4 : How to get the real HTML content from a page with many DIV inline editors on same page? (save to 1 file)

1 Answers