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

RadEditor steals focus

4 Answers 213 Views

Editor

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

Teodorico asked on 16 Feb 2010, 05:22 PM

Hi,
It seems that the RadEditor steals the focus from a textbox setup on pageLoad. This only happens on IE7 and IE8. It behaves as expected on all other browsers.
This is a sample code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="RadEditor.aspx.cs" Inherits="Application_Test_Telerik_RadEditor" %>

<!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>
<script type="text/javascript">

  function pageLoad()
  {
   $get("txt").focus();
  }

    </script>
</head>
<body>
    <form id="form1" runat="server">
  <asp:ScriptManager ID="ScriptManager" runat="server" >
  </asp:ScriptManager>
  <input id="txt" type="text" />
  <telerik:radeditor runat="server" ID="RadEditor" SkinID="BasicTools" Width="100%" Height="350px" EditModes="Design" Enabled="true" >
  </telerik:radeditor>
    </form>
</body>
</html>

If I change Enabled="false" the focus remains on the textbox.

Regards.

If I change Enabled="false" the focus remains on the textbox.Regards.

4 Answers, 1 is accepted

answered on 17 Feb 2010, 12:46 PM

Hello Teodorico,

The problem comes from the different loading times and the pint your code executes under different browsers. What I can suggest is to set the focus with a little timeout, actually 0ms will also do the trick. I believe that it will be also better if you set the focus when the editor is loaded but with your current implementation with the pageLoad function and 0ms timeout everything should also work.

This being said I suggest to modify your code in the following manner:

<%@ Page Language="C#" %>

<%@ 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 id="Head1" runat="server">

<title>Untitled Page</title>

<script type="text/javascript">

function SetInputFocus()

{

setTimeout(function(){

$get("txt").focus();},0);

}

</script>

</head>

<body>

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

<asp:ScriptManager ID="ScriptManager" runat="server">

</asp:ScriptManager>

<input id="txt" type="text" />

<telerik:RadEditor runat="server" OnClientLoad="SetInputFocus" ID="RadEditor" Width="100%"

Height="350px" EditModes="Design" Enabled="true">

</telerik:RadEditor>

</form>

</body>

</html>

Best wishes,
Svetlina
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

answered on 17 May 2010, 04:19 PM

Hi there,

We are having a very similar problem to the one listed in the post. However, in our case we have multiple controls on our page and do not want to set the focus back to one control each time the RadEditor is loaded.

For example, let's say our page has the following controls:

If dd1 initates the postback we would like the focus set back to dd1. The same goes for dd2. In your solution it appears that each time the RadEditor loads, the focus will always go to the one control ('txt'). Is there a way to dynamic adjust your JS method below to go to different controls in different situations?

<asp:DropDownList ID="dd1" Width="250px" runat="server" CssClass="formHeaderField" AutoPostBack="true"

TabIndex="102" OnSelectedIndexChanged="dd1_SelectedIndexChanged" />

asp:TextBox ID="txt1" MaxLength="50" runat="server" CssClass="formHeaderField" TabIndex="103" />

<asp:TextBox ID="txt2" MaxLength="50" runat="server" CssClass="formHeaderField" TabIndex="104" />

<asp:DropDownList ID="dd2" Width="250px" runat="server" CssClass="formHeaderField" AutoPostBack="true"

TabIndex="105" OnSelectedIndexChanged="dd2_SelectedIndexChanged" />

<rade:RadEditor id="RadEditor1" Runat="server"></rade:RadEditor>

In our case if the RadEditor is removed from the page, or we set it to disabled the focus logic works properly. We tried setting the enabled property back to true after our JS script to set the focus but that caused the focus to be lost.

Any input would be great.

Thanks,
CK

answered on 18 May 2010, 12:46 PM

default2-aspx.zip

Hi CK,

For such scenario, I suggest you to add a hidden field to the page that should store the ID of the control causing the postback, to be used in the RadEditor's OnClientLoad handler.

Please find attached a sample website implementing this approach.

Sincerely yours,
Dobromir
the Telerik team