How to get tinymce content in jquery?
Html text editor text code:
<textarea name="description" class="tinymce" id="texteditor"></textarea>
You can print TinyMCE text editor code using javascript like this.
var content = tinymce.get("texteditor").getContent();
alert(descriptionFieldTxt);
output:
output with tags
Now you can print tinymce texteditor value without p tag like this
var content = tinymce.get("texteditor").getContent({format: "text"});
alert(descriptionFieldTxt);
This code print text without tags:
TinyMCE object/library is the one the responsible for your Editor, so you should use that object to get the content.
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).
Only with jQuery - You should never use this
If for some reason you really have to use only jQuery for that (and I really don't understand why), you can use the id of the original element, concatenated with _ifr
and get the content. Using this option will probably give you don't want, because tinymce add tags to the html that exists in the dom but stripped when calling the getContent
function.
Here is an example for the 3 options:
$('#btn1').click(function() {
console.log(tinyMCE.activeEditor.getContent());
});
$('#btn2').click(function() {
console.log(tinyMCE.editors[$('#ta').attr('id')].getContent());
});
$('#btn3').click(function() {
alert('You should really NOT use this option');
console.log($('#ta_ifr')[0].contentDocument.body.innerHTML);
});
Here is a working example: https://jsfiddle.net/8tdf3q22/