How to select a tinyMCE WYSIWYG from the DOM?

2
votes

I've upgraded TinyMCE to the latest version of today. I'm simply trying to edit the content qith JQuery as documented here.

My problem is, whatever the id I try to select in my jQuery function, it returns undefined. Let say I have :

<tr>
  <td align="right" valign="top" class="HDivider">About</td>
  <td class="HDivider"><textarea name="about" cols="70" rows="10" id="about"><?php echo $about; ?></textarea></td>
</tr>

the when doing :

console.log(tinyMCE);

I got an object in my console :

Object {majorVersion: "4", minorVersion: "0b2", releaseDate: "2013-04-24", editors: Array[2], i18n: Object…}

And when doing

console.log(tinyMCE.get('#about'));

I got undefined ..

Why ? how can I select my tinyMCE editor ?

I tried to inspect the elements with Chrome or Firebug, see the TinyMCE elements (the one appended automaticaly), and check for their id ... and use them, but no chance.

Please advice

Thanks

1
phpjquerytinymcewysiwygtext-editor
Have you tried without the hashtag # ??? – Mathlight
man ... you got it :) – Miles M.
Alright, i make an answer of it so you can mark this as answerd so others will not be trying to answer this question anymore ;) – Mathlight

1 Answers

2
votes

When you look at this line in the pastebin you provided you see that it doesn't use the JQuery selecter ( # for id or . for class )

var content = tinyMCE.get('content').getContent();

So you must change your code to this:

console.log( tinyMCE.get('about') );