Shift focus from RadEditor content area to its parent on Escape key press

Description

Shift focus from RadEditor content area to its parent on Escape key press

Solution

The example below demonstrates how to attach to the onkeydown event of the content area via the attachEventHandler method, listen for the Esc key execution and programmatically focus the parent element of RadEditor:

ASP.NET

<script type="text/javascript">
    function OnClientLoad(editor, args) {
        editor.attachEventHandler("onkeydown", function (e) {
            if (e.keyCode == "27") //Esc key press
            {
                var divWrapper = $get("RadEditorDivWrapper")
                divWrapper.focus();
                divWrapper.style.border = "1px solid blue";
            }
        });
    }
</script>
<div id="RadEditorDivWrapper" tabindex="-1">
    <telerik:RadEditor runat="server" ID="RadEditor1" OnClientLoad="OnClientLoad"></telerik:RadEditor>
</div>

Pro Tips

• The solution is universal, but requires to set a tabIndex to the non editable element (div, span, paragraph or other) on which you want to programmatically put the focus on. In the example above, this is the
  wrapper with id="RadEditorDivWrapper" and tabIndex="-1". The tabIndex attribute with value of "-1" makes the element focusable by script only.
• Another way to move the focus from the content area to the first button of the editor's toolbar is to press the F10 key.