Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to load html using jquery into a TinyMCE textarea

I've a textarea that uses TinyMCE as a WYSIWYG. Once that this textarea is loaded I want that, clicking a button "Edit" some html code that I bring with AJAX jquery is loaded in that textarea.

I want to insert this html code <p>hello</p>

Original textarea source

<textarea name="corpo" id="input_corpo">Text Here</textarea>

JQUERY Script that brings the HTML. In this way it updates only the textarea (which is hidden while TinyMCE is in action)

$.get("hello.html", 
        function(content){ $("#input_corpo").text(content);});
     return false;});

Neither in this way below it works. I tryed to update the body of the iframe that generates TinyMCE

$.get("hello.html", 
    function(content){ $("body#tinymce").text(content);});
return false;});

How can I do?

like image 207
user191687 Avatar asked Oct 17 '09 13:10

user191687


People also ask

How do I set HTML content in TinyMCE?

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 get the content of TinyMCE editor in jQuery?

You can use the activeEditor for that, or if (for some reason) you have the original element that created the editor in a jQuery object, you can use that jQuery object to get the id of the original element and use that in order to get the content of the TinyMCE (using the TinyMCE editor).

Does TinyMCE need jQuery?

TinyMCE in a jQuery UI DialogThis code is required because jQuery blocks all focusin calls from elements outside the dialog.

What is TinyMCE jQuery?

The TinyMCE for jQuery plugin also adds a tinymce pseudo selector. This can be used to get all the instances of a page or check if an element has an editor instance or not. Below is an example on how to use the pseudo selector. // Getting all converted textareas and set contents to the $('textarea:tinymce').


1 Answers

You could try with the setContent function:

$.get("hello.html", function(content) { 
    // if you have one tinyMCE box on the page:
    tinyMCE.activeEditor.setContent(content);
});

or even shorter:

$.get("hello.html", tinyMCE.activeEditor.setContent);
like image 170
Darin Dimitrov Avatar answered Oct 06 '22 22:10

Darin Dimitrov