How to process keyup event in WebHtmlEditor

Alex Kartavov / Wednesday, August 25, 2010

ClientSideEvents of WebHtmlEditor do not have KeyUp event. If application needs to process that event, then it may use following codes. They contain some internal objects methods and mimic internal logic of control. It processes initialze event and adds listener to the keyup event over editing area.

To find reference to editor from source element of browser-event, the element or id can be used.

<script type="text/javascript">
function initEditor(editor)
{
 // under IE editing element is DIV which belongs to document of page
 // under other browsers, editing element is IFRAME and listeners
 // should be added to its document
 var elem = editor._ie ? editor._elem : editor._doc();
 // that is a shortcut to add handler/listener to browser's event
 editor._addLsnr(elem, 'keyup', keyUpHandler);
}
function keyUpHandler(evt)
{
 if(!evt) if((evt = window.event) == null)
  return;
 // try to find target html element
 var editor = null, src = evt.target;
 if(!src) if(!(src = evt.srcElement) == null)
  return;
 var doc = src.ownerDocument;
 // try to get reference to editor from element
 var editor = iged_getById(src);
 // editing area is IFRAME. Try to find id of its document
 if(!editor)
 {
  var id = null, doc = src.ownerDocument;
  if(doc)
   id = doc.id;
  if(!id)
   id = src.id;
  if(!id)
   try{id = src.document.id;}catch(ex){}
  // try to find editor from id
  if(id && id.indexOf('ig_d_') == 0)
   editor = iged_getById(id.substring(5));
 }
 if(!editor)
  return;
 // success
 alert('' + evt.keyCode + ' editor=' + editor.ID)
}
</script>

<ighedit:WebHtmlEditor ID="WebHtmlEditor1" runat="server">
    <ClientSideEvents Initialize="initEditor" />
</ighedit:WebHtmlEditor>

ASP.NET Team