Tutorial :how to get the image inserted from the tinymce editor?


I am trying to use the tinymce text editor, but am not being able to get the contents of the editor using jQuery , and also if I use the simple post method to get the value I get the text, but am not getting the image?

The code I tried using jQuery was:

$(document).ready(function()  {      $("#save").click(function()      {          $.post("test_skin_dump.php",{              data_info:$("#elm2").html;          } ,function(data) {              if(data)              {                  $("#show_result").html(data);              }                         });      });  });     <textarea id="elm2" name="elm2" rows="15" cols="80" style="width: 80%">   </textarea>  

What am I doing wrong could anybody correct me, please?


TinyMCE has its own API which you can take advantage of. In fact, it is really not too bad. In your case, you can get the entire of the editor via:


If you are sure that the user has clicked on the image (i.e. selected), then you can do this to only get the image node:


Note that .selection is a property, which is why it doesn't have a set of parentheses.

If you do not like any of this code, or for some reason it doesn't quite answer your question, feel free to check out the following links:

Let me know if there is anything else you need.


html is a function. You are missing the parentheses. You also have an extra semicolon.

Replace this:


With this:


The rest looks fine.


Use the following Command to Inset the Code into your editor:

tinyMCE.execCommand('mceInsertContent',false,'<img src="mypic.png" />');  

Hope this Helps :)

Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Next Post »