This is a migrated thread and some comments may be shown as answers.

Tab into Editor - Focus Issue

1 Answer 40 Views

Editor

This is a migrated thread and some comments may be shown as answers.

Navaneeth asked on 01 Feb 2011, 11:36 PM

TabIntoRADEditor-Actual.JPG

TabIntoRADEditor-Desired.JPG

Hello,

I am using RadControls for ASP.NET AJAX Q2 2010; I have found a few posts that discusses the focus issue with RADEditor when the control receives focus from another control. The cursor does get placed in the Editor contect area, however the container is selected; irrespective of the contentAreaMode (DIV / IFrame). Refer attached image (TabIntoRADEditor_Actual.JPG). If we start typing the selection indicator is going away. Is there a way to avoid this behavior; and stil retain the tabbing functionality in the editor workspace? Attached is the sample source that I have tried as per forum posts (to avoid the tabs on the toolbar items).

Thanks.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TryTelerikFeatures._Default" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head runat="server">

<title>Untitled Page</title>

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="radScriptMgr" runat="server" EnableTheming="True">

</telerik:RadScriptManager>

<asp:TextBox ID="ctrl1" runat="server" TabIndex="1">

</asp:TextBox>

<asp:DropDownList ID="ctrl2" runat="server" TabIndex="2">

<asp:ListItem>Option 1</asp:ListItem>

<asp:ListItem>Option 2</asp:ListItem>

</asp:DropDownList>

<br />

<telerik:RadEditor ID="myEditor" runat="server" ContentAreaMode="iframe" OnClientLoad="OnClientLoad">

</telerik:RadEditor>

</form>

</body>

</html>

<script type="text/javascript" language="javascript">

function OnClientLoad(editor, args)

{

var buttonsHolder = $get(editor.get_id() + "Top");

var buttons = buttonsHolder.getElementsByTagName("A");

for (var i=0; i< buttons.length; i++)

{

var a = buttons[i];

a.tabIndex = -1;

a.tabStop = false;

}

</script>

Tab into Editor - Focus Issue

1 Answer, 1 is accepted