RadEditor Not Focusing in ContentArea

[saad]

Telerik Team

i have 2 text boxes and one rad-editor on a page
when i tab in rad-Editor it didn't focus on content area
it focus on its other control like (image manager, alignment etc)



I need to fix this issue as soon as possible
your early response will be appreciated
Regards

[Rumen]

Hello Saad,

Try the following code:

<script type="text/javascript">
function OnClientLoad(editor, args)
{
var buttonsHolder = $get(editor.get_id() + "Top"); //get a reference to the top toolbar zone of the editor
var buttons = buttonsHolder.getElementsByTagName("A"); //get a reference to all A elements on the toolbar and disable the tabbing trough them
for (var i=0; i< buttons.length; i++)
{
var a = buttons[i];
a.tabIndex = -1;
a.tabStop = false;
}
}
</script>
<telerik:radeditor OnClientLoad="OnClientLoad" runat="server" ID="RadEditor1">
</telerik:radeditor>

Regards,
Rumen
the Telerik team

[Chuck]

I tried this solution.  It works very well by disabling the toolbar items (tabstop = false for all of them).  But it doesn't add focus on the editable area - looks like it is just focusing the entire control.

In short, my users can't tab and type.  They have to tab to the control, then click it, then begin typing.

[Terance Emory]

I am having a similar issue, I am using server-side .focus() method in the Page PreRender event which runs, but focus does not start on the RadEditor control.

[Rumen]

Hi,

You can try the solution provided in the following forum thread: how to set focus to radEditor body on click of tab of previous control?

Best regards,
Rumen
the Telerik team

[CaseNet]

Hello Rumen admin,

I'm using your function to tab focus contentArea of editor.

Press Tab -> It's work ok.

Press Shift + Tab(move back other control): It always focus in last toolbar button.

I see link: https://demos.telerik.com/aspnet-ajax/editor/examples/accessibleeditor/defaultcs.aspx

--> Shift + Tab moves the focus from the edit area to the last toolbar button (standard MS Word shortcut).

I need move other control when using Shift+Tab .

Have you any idea to fix my case? 

I'm using licence Telerik.

Thanks for your support. 

 

 

 

[Rumen]

Hi there,

You can use the following code example for the DIV content area of RadEditor to make the Shift+Tab combination setting the focus on the element before RadEditor, but not the toolbar:

Tab Index 1:
<telerik:RadTextBox runat="server" ID="RadTextBoxInput" TabIndex="1"></telerik:RadTextBox>
<br />
<br />
Tab Index 2:
<telerik:RadEditor ID="RadEditor1" Skin="Default" OnClientLoad="OnClientLoad" ContentAreaMode="Div" runat="server">
</telerik:RadEditor>
<br />
Tab Index 2:
<telerik:RadTextBox runat="server" ID="RadTextBox2" TabIndex="3"></telerik:RadTextBox>

<script type="text/javascript">
    function OnClientLoad(editor, args) {
        editor.get_contentArea().tabIndex = "2"; //set tabIndex to the content area

        editor.removeShortCut("InsertTab");
        editor.removeShortCut("InsertShiftTab");
        var buttonsHolder = $get(editor.get_id() + "Top"); //get a reference to the top toolbar zone of the editor
        var buttons = buttonsHolder.getElementsByTagName("A"); //get a reference to all A elements on the toolbar and disable the tabbing through them
        for (var i = 0; i < buttons.length; i++) {
            var a = buttons[i];
            a.tabIndex = -1;
            a.tabStop = false;
        }
    }
</script>

Regards,
Rumen
Progress Telerik