Getting the value from a TinyMCE textarea

JavascriptTinymce

Javascript Problem Overview


I have a news editor for my site with which I am using TinyMCE. What I would like to be able to do is have a button (outside of the TinyMCE editor itself) that I can click to scan the textarea for any images, then list those images as options to use for a thumbnail image for said news article.

For an idea of what I mean, please see this link here: <https://docs.google.com/leaf?id=0B05m73kzudwPNzUwZjkyNmItYjZkMy00NTdlLTlkNDctOGRhYThjMzNjNTM5&hl=en_US>

My problem is that document.getElementById('NewsArticle').value is not returning anything when there is text in the textarea

The other potential problem is that whats shown in the textarea is not actual code, but images etc too so I wasn't sure it would even work in the first place, but since when the form is submitted the data[News][article] value is back into text, I thought there might be a chance.

If anyone knows how to get either the content or code for the tinyMCE textarea, or has a better solution, I'd be interested to hear

Javascript Solutions


Solution 1 - Javascript

TinyMce has an api for accessing content from the editor.

This code will grab the html from the active editor:

// 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()

Solution 2 - Javascript

Use below syntax, which will remove unwanted character from your input textarea....

(((tinyMCE.get('YourTextAreaId').getContent()).replace(/(&nbsp;)*/g, "")).replace(/(<p>)*/g, "")).replace(/<(\/)?p[^>]*>/g, "");

Solution 3 - Javascript

Try

window.parent.tinymce.get('contentID').getContent();

For some reason, the stock-standard tinymce.get() call didn't work for me, so I tried this and it works. :)

Solution 4 - Javascript

var temp = tinymce.get('textAreaName').save();
console.log(temp);

OR

var temp =tinymce.get('textAreaName').getContent();
console.log(temp);

Solution 5 - Javascript

Probably you have something like

<form>
  <textarea id="myArea">Hello, World!</textarea>
</form>

you should simply add as follows

<form method="post">
  <textarea id="myArea" name="value">Hello, World!</textarea>
  <input type="submit">
</form>

and you can catch the data with PHP under myArea var.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionSanflyView Question on Stackoverflow
Solution 1 - JavascriptMatthew ManelaView Answer on Stackoverflow
Solution 2 - JavascriptMilanView Answer on Stackoverflow
Solution 3 - JavascriptXtraSimplicityView Answer on Stackoverflow
Solution 4 - JavascriptSujith SView Answer on Stackoverflow
Solution 5 - Javascriptuser3558547View Answer on Stackoverflow