Focus event in Preview mode only working in IE

[Richard]

Hi,

I'm trying to attach a client-side focus event to the RadEditor, which I'm using in Preview mode.
I've tried to follow some of the examples hat I've seen on the forum here.  I've got it working correctly in IE, however I'm having trouble in Firefox or Chrome - the focus event doesn't seem to get triggered.

The JavaScript I'm using to set up the focus event is:

<script type="text/javascript">
    function setupEditorFocus(editor, eventArgs) {
        var EditorElement = editor.get_contentArea();
        $telerik.addExternalHandler(EditorElement, "focus", function () {
            editorFocus(editor.get_id());
        });
    }
    function editorFocus(editorId) {
        document.getElementById("messageArea").innerHTML = "Set focus " + Date();
    }

</script>

And my RadEditor is set up using:

<telerik:RadEditor id="RadEditor1" runat="server" onclientload="setupEditorFocus" editmodes="Preview">
    <Content>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</Content>
</telerik:RadEditor>

Thanks in advance for any help!

Richard

[Marin Bratanov]

Hi Richard,

The onfocus event is not supported for an iframe, which is what the RadEditor content area is. You can confirm this with the attached simple page that shows an editable iframe. The focus event will still fire with IE, but it should not be supported: http://www.w3schools.com/jsref/event_onfocus.asp.

What you can do is to
- set ContentAreaMode="Div" so that the content area of the editor is an editable div, not an iframe. Then, in design mode, you can click and focus it (but not in preview mode, because it is no longer the same element)
- consider using the click and/or mousedown and/or keydown/keypress event instead of focus, if it can fit your scenario


Regards,
Marin Bratanov
Telerik

[Richard]

Thank you - that's really helpful.

I am able to use the mousedown and keydown handlers as you suggested, and this is working well now.

Thanks again!