TinyMCE - How can I have 2 editors on the same page with only one preview button for both editors

1
votes

I have a page, just like a blog, with two textareas (TinyMCE editors), each editor with the preview button inside the editor, I would like to know how I can have only one preview button outside the editors for both textareas, showing the two editor's contents.

Searching here, I try to separate configurations for each editor, for elements... but I dont know what to do.

Is it even possible?

A image for a idea: http://dl.dropbox.com/u/1143414/preview.JPG , are two editors

1
javascripttinymce

1 Answers

1
votes

You would need to implement it yourself. Here is a short description of what you will need to do:

1. Grab the html content of the editor #1

var content_1 = tinymce.get(editor_id_1).getContent();

2. Grab the html content of the editor #2

var content2 = tinymce.get(editor_id_2).getContent();

3. You will need an own popup or modal dialog, i call it dialog

4. Put both contents inside one html element

var div = document.createElement('div');
div.id = "my_preview";
div.innerHTML = content_1 + "<hr>" + content_2;

5. Load the div into your popup or modal dialog

dialog.addChild(div);