<scripttype="text/javascript">var oDoc = null;
functionOnClientLoad(editor, args) {
oDoc = editor.get_document();
editor.attachEventHandler("onkeyup", function (e) {
var content = editor.get_html();
var searchFor = "~m";
if (content.toLowerCase().indexOf(searchFor) > -1) {
var textRect = $telerik.getBounds(editor.getSelectedElement());
alert("X: " + textRect.x + " Y: " + textRect.y);
}
});
}
</script><telerik:RadEditorrunat="server"ID="RadEditor1"OnClientLoad="OnClientLoad"ContentAreaMode="Div"><Content>
Some text on line 1 <br /> Some text on line 2 <br /> Some text on line 3 <br /></Content></telerik:RadEditor>
Here is an example on how to replace the ~m string with other content. The <span id='marker'></span> HTML in the newContent variable is the marker which gets replaced and its sibling selected at cursor position. You can add your DIV element inside the newContent string so that it gets inserted at cursor position as shown below:
var newContent = content.replace(/\~m/gi, "<div>my div<span id='marker'></span> inserted at cursor position</div>");
editor.set_html(newContent);
var marker = editor.findContent("#marker"); //find the span marker with id='marker'var previous = marker[0].previousSibling; //get the previous sibling of the marker
marker.remove(); //remove the markervar range = Telerik.Web.UI.Editor.DomRange.createRange(editor.get_document());
range.setStart(previous, previous.length);
range.setEnd(previous, previous.length);
range.select();
Regards,
Rumen
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.