Skip to content Skip to sidebar Skip to footer

How To Insert An Image At Cursor Position In Tinymce

I am using following codes to fetch the conent of tinymce. tinymce_content=tinyMCE.get('txt_area_id').getContent(); updated_content=tinymce_content+'';

Solution 1:

This will insert an image node at the selected spot (cursor position) in a tinymce editor

var ed = tinyMCE.get('txt_area_id');                // get editor instancevarrange = ed.selection.getRng();                  // get rangevar newNode = ed.getDoc().createElement ( "img" );  // create img node
newNode.src="sample.jpg";                           // add src attributerange.insertNode(newNode);                          // insert Node

Solution 2:

@Thariama's answer worked fine for me in Chrome, but not in IE. I had to modify it to the following to get it to work in both browsers:

var ed = tinyMCE.get('txt_area_id');                // get editor instancevar newNode = ed.getDoc().createElement ( "img" );  // create img node
newNode.src="sample.jpg";                           // add src attribute
ed.execCommand('mceInsertContent', false, newNode.outerHTML)

(IE was telling me that range did not have an insertNode method.)

Post a Comment for "How To Insert An Image At Cursor Position In Tinymce"