Hello.
In the following html page, the cursor is displayed in the login field when the page is loaded:
However, when the corresponding aspx page is loaded (with the RadFormDecorator component), the cursor is no longer displayed:
No methods have been implemented in the code behind.
Why isn't the cursor being displayed?
Thank you in advance.
Paulo
In the following html page, the cursor is displayed in the login field when the page is loaded:
<!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> <title></title> </head> <body> <center> <form id="form1" runat="server" method="post" action=""> <table style="background:#cccccc" cellpadding="2" cellspacing="3"> <tr align="center"> <td></td> <td align="right"><label>Login: </label></td> <td align="left"><input type="text" id="login" style="width:140px" maxlength="30" /></td> <td></td> </tr> <tr align="center"> <td></td> <td align="right"><label>Password: </label></td> <td align="left"><input type="text" id="password" style="width:140px" maxlength="30" /></td> <td></td> </tr> </table> <br /> <input type="button" value="Login" style="width:65px;" /> </form> </center> <script type="text/javascript"> document.forms["form1"]["login"].focus(); </script> </body> </html> However, when the corresponding aspx page is loaded (with the RadFormDecorator component), the cursor is no longer displayed:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="MemberJoin._Default" %> <!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> <title></title> </head> <body> <center> <form id="form1" runat="server" method="post" action=""> <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager> <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" DecoratedControls="All" /> <table style="background:#cccccc" cellpadding="2" cellspacing="3"> <tr align="center"> <td></td> <td align="right"><label>Login: </label></td> <td align="left"><input type="text" id="login" style="width:140px" maxlength="30" /></td> <td></td> </tr> <tr align="center"> <td></td> <td align="right"><label>Password: </label></td> <td align="left"><input type="text" id="password" style="width:140px" maxlength="30" /></td> <td></td> </tr> </table> <br /> <input type="button" value="Login" style="width:65px;" onclick="validateLogin()" /> </form> </center> <script type="text/javascript"> document.forms["form1"]["login"].focus(); </script> </body> </html> No methods have been implemented in the code behind.
Why isn't the cursor being displayed?
Thank you in advance.
Paulo
2 Answers, 1 is accepted
0
Accepted
Hi Paulo,
This behavior can be observed only under IE browsers, versions below 9, where the rounded corners of the inputs are done through additional HTML/DOM elements. When the input is focused and after that changes position in the DOM tree, it loses that focus. Therefore you need to wait for the page to load and then set the focus. A small tweak is to force the select of the input so that you can be absolutely sure the cursor will appear. Here is a sample implementation for your case:
Just replace your call to the focus method with this javascript snippet and you are good to go.
Hope this helps.
Greetings,
Niko
the Telerik team
This behavior can be observed only under IE browsers, versions below 9, where the rounded corners of the inputs are done through additional HTML/DOM elements. When the input is focused and after that changes position in the DOM tree, it loses that focus. Therefore you need to wait for the page to load and then set the focus. A small tweak is to force the select of the input so that you can be absolutely sure the cursor will appear. Here is a sample implementation for your case:
function pageLoad() { $get("login").focus(); $get("login").select(); }Hope this helps.
Greetings,
Niko
the Telerik team
Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
0
Paulo
Top achievements
Rank 1
Rank 1
answered on 20 Sep 2011, 03:30 PM
Hello, Niko.
Thank you for your reply.
The problem has been solved.
Paulo
Thank you for your reply.
The problem has been solved.
Paulo