CODEWITHSUNDEEP
javascripttinymcetinymce-4
buck54321
buck54321

Reputation: 847

Insert element using TinyMCE execCommand and retain a reference

When using TinyMCE4, you can insert content at the cursor using 

.execCommand('mceInsertContent', false, 'content')

I need to insert content but retain a reference to said content. I have tried

var div = document.createElement('div');
tinymce.activeEditor.execCommand('mceInsertContent', false, div);

but tinyMCE throws an error. The question has been asked a few places, but never received a single response. For example

Reference for inserted element through execCommand (insertContent) in TinyMCE

and

http://www.tinymce.com/forum/viewtopic.php?id=35214

Upvotes: 4

Views: 5067

Answers (1)

Thariama
Thariama

Reputation: 50840

There is a way:

var span = tinymce.activeEditor.getDoc().createElement('span');
span.setAttribute('id', 'test');
tinymce.activeEditor.execCommand('mceInsertContent', false, span.outerHTML);
var my_elem = tinymce.activeEditor.getBody().querySelector('#test');
console.log('my_elem', my_elem);

If needed remove the id attribute afterwards (you could also use a class attribute or anything else).

Upvotes: 2

Related Questions