CODEWITHSUNDEEP
tinymce
Su Beng Keong
Su Beng Keong

Reputation: 1034

highlighting certain range of tinymce text after a button event

Referring to a few source, and i put this into a button event, given,

<textarea id="content" name="content" style="width:400px;height:100px;">
<p><span style="font-weight:bold;font-size:36pt;">Some text <u>here</u> to go.</span></p>
</textarea>

var range = document.createRange();
var start = document.getElementById('tinymce');
var textNode = start.getElementsByTagName('p')[0].firstChild;
range.setStart(textNode, 1);
range.setEnd(textNode, 1);
window.getSelection().addRange(range);

but it produce error in chrome console : Uncaught TypeError: Cannot read property 'getElementsByTagName' of null

suppose i have tinymce element that generated by tinymce at first place. any expert can help me on that?

Upvotes: 0

Views: 198

Answers (1)

klvmungai
klvmungai

Reputation: 824

The error is caused by the fact that the tinymce id is not present in the current top level document but on the iFrame's document. So you have to first access the iFrame and get the document element.

var frame= document.getElementById('content_ifr');
var doc = frame.contentWindow.document;
var range = doc.createRange();
var start = doc.getElementById('tinymce');

find a working fiddle HERE

Upvotes: 1

Related Questions