I had a custom treeview control on same page as my editor so when i clicked a treenode i wanted code to insert into the editor. However, doing so the editor would lose the cursor position and insert at beginning of document. I noticed a number of posts that wanted some similar function but all the code samples were spread across multiple posts. Here is what i found works for me. Definitely can be improved.
First you need to create a editor reference, a rangeobject to hold selection range, and capture certain editor events in my case.
<
script language="javascript" type="text/javascript">
var editor1 = document.getElementById('<%=Editor1.ClientID%>');
var rCursorRange = null;
setTimeout(CE_attachEvent,1000);
function CE_attachEvent()
{
var editdoc=editor1.GetDocument();
editor1.FocusDocument();
// attach Event - i want capture cursor position in editor on keystoke or mouseclick
if(editdoc.attachEvent)
{
editdoc.attachEvent('onkeyup',storeTextRange);
editdoc.attachEvent('onmouseup',storeTextRange);
}
else if(editdoc.addEventListener)
{
//my app is IE so included this for other browsers
editdoc.addEventListener('onkeyup',storeTextRange,true);
editdoc.addEventListener('onmouseup',storeTextRange,true);
}
}
function CuteEditor_OnCommand(editor,command,ui,value)
{
//anoying bug - when switch activetabs, it drops all events linked to editor, so need reattach
if(command=="TabEdit")
{
//reattach the event here
setTimeout(CE_attachEvent,1000);
}
}
function storeTextRange()
{
//here track the selection object into range varaible- note that i am only interested in text ranges
//you can handle control ranges by
var editdoc=editor1.GetDocument();
if (editdoc.selection.type != null)
{ if (editdoc.selection.type.toLowerCase() != 'control')
{ rCursorRange = editdoc.selection.createRange().duplicate(); }
}
}
</script>
At this point, and keyup or mouse event will save cusor insert position into rCursorRange object
Now need javascript to insert at that point.
function
InsertDataField(value)
{
var editdoc=editor1.GetDocument();
if (value!=null)
{
//make sure I insert code as HTML, not escaped value
InsValue= value.replace(/</gi,
'<');
//focus on editor before can insert into global textrange
try {
editor1.SetActiveTab('Edit');
editor1.FocusDocument();
if (rCursorRange==null)
{
// no Cursor saved yet, so default insert at begining document and set cursor reference
editor1.PasteHTML(InsValue + " ");
rCursorRange = editdoc.selection.createRange().duplicate();
} else {
//paste code and set cursor to end of insert
rCursorRange.pasteHTML(InsValue + " ");
rCursorRange.collapse(false); // set to true if you want to move cursor to begin
rCursorRange.select();
}
} catch(err) {alert(err.description)}
}}
the only bug I have currently with this is when insert HTML table, untill you click on editor or interact with it, it will not show the table in normal mode.
Hope this helps
Greg