What's New?

[CLOSED] Set Focus to textfield in logon window

  1. #1
    May 17, 2009, 1:37 PM

    [CLOSED] Set Focus to textfield in logon window

    I have a logon modal window that I need to set the focus on the txtUserName field. I've tried adding a Listener with activate handler=txtUserName.focus() but it doesn't seem to work. Do I need to set the focus to Window1 first?

  2. #2
    May 17, 2009, 3:36 PM

    RE: [CLOSED] Set Focus to textfield in logon window

    In the Page_Load event (or similar) could you call .Focus()?

    Example


    txtUserName.Focus();

    Another option is to add the handler to the <Show> Listener of the window.*


    Example


    <Show Handler="txtUserName.focus();" />

    Hope this helps.


    Geoffrey McGill
    Founder
    Ext.NETASP.NET UI Component framework
    RetypeDocumentation website generator
    MojeeLightning fast Emoji library for .NET
    Ext.NET Examples|Ext.NET API Docs|ExtJS API Docs|Twitter
  3. #3
    May 17, 2009, 6:27 PM

    RE: [CLOSED] Set Focus to textfield in logon window

    I think the call to .Focus() is happening a bit too quick and the rendering of the form is not 100% complete. There's an override on the .Focus() which allows for a delay. I'll post a sample.

    Geoffrey McGill
    Founder
    Ext.NETASP.NET UI Component framework
    RetypeDocumentation website generator
    MojeeLightning fast Emoji library for .NET
    Ext.NET Examples|Ext.NET API Docs|ExtJS API Docs|Twitter
  4. #4
    May 17, 2009, 6:53 PM

    RE: [CLOSED] Set Focus to textfield in logon window

    Here's a sample demonstrating the use of .Focus() with the optional delay parameter.

    Example

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

<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Ext.IsAjaxRequest)
        {
            this.TextField1.Focus(false, 100);
        }
    }
</script>

<!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>Coolite Toolkit</title>
</head>
<body>
    <form id="form1" runat="server">
        <ext:ScriptManager ID="ScriptManager1" runat="server" />

        <ext:Window 
            ID="Window1" 
            runat="server" 
            Title="Window"
            Height="185"
            Width="300"
            BodyStyle="padding:6px;">
            <Body>
                <ext:FormLayout runat="server">
                    <Anchors>
                        <ext:Anchor Horizontal="100%">
                            <ext:TextField ID="TextField1" runat="server" FieldLabel="Username" />
                        </ext:Anchor>
                        <ext:Anchor Horizontal="100%">
                            <ext:TextField ID="TextField2" runat="server" FieldLabel="Password" InputType="Password" />
                        </ext:Anchor>
                    </Anchors>
                </ext:FormLayout>
            </Body>
            <Buttons>
                <ext:Button runat="server" Text="Login" />
            </Buttons>
        </ext:Window>
    </form>
</body>
</html>
    Hope this helps.

    Geoffrey McGill
    Founder
    Ext.NETASP.NET UI Component framework
    RetypeDocumentation website generator
    MojeeLightning fast Emoji library for .NET
    Ext.NET Examples|Ext.NET API Docs|ExtJS API Docs|Twitter
  5. #5
    May 17, 2009, 6:54 PM

    RE: [CLOSED] Set Focus to textfield in logon window

    Hi Geoffery

    Here is my code:

    



function log() {


if(lnkLogin.innerHTML=="Login")


{



txtclUsername.focus();
Window1.show();
lnkLogin.innerHTML="Logout"


}


else


{ 


lnkLogin.innerHTML="Login" 


} 


}


    Thank you. I think there is another problem because it triggers the validation and still doesn't set the focus properly.

  6. #6
    May 17, 2009, 6:56 PM

    RE: [CLOSED] Set Focus to textfield in logon window

    Can you set the timing on the client side?
  7. #7
    May 17, 2009, 6:57 PM

    RE: [CLOSED] Set Focus to textfield in logon window

    You should call txtclUsername.focus after Window1.show and add the delay parameter.

    Example

    Window1.show();

txtclUsername.focus(false, 100);
    ExtJS client-side API docs:
    http://extjs.com/deploy/dev/docs/?cl...p;member=focus

    Geoffrey McGill
    Founder
    Ext.NETASP.NET UI Component framework
    RetypeDocumentation website generator
    MojeeLightning fast Emoji library for .NET
    Ext.NET Examples|Ext.NET API Docs|ExtJS API Docs|Twitter
  8. #8
    May 17, 2009, 9:41 PM

    RE: [CLOSED] Set Focus to textfield in logon window

    Hi Geoffrey
    That did the trick. It works now.

    Thanks
    Howard

Similar Threads

  1. [CLOSED] Set focus to TextField once Window is visible
    By digitek in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Jul 13, 2012, 11:45 AM
  2. [CLOSED] Focus TextField if Window Hide=true
    By macap in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Jul 12, 2010, 1:59 PM
  3. [CLOSED] How to focus TextField in Window?
    By macap in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jan 14, 2010, 8:18 AM
  4. Set focus on TextField after window load
    By sfvaleriano in forum 1.x Help
    Replies: 0
    Last Post: Oct 15, 2009, 8:27 AM
  5. Focus on Textfield
    By hans4 in forum 1.x Help
    Replies: 2
    Last Post: Jul 02, 2009, 9:08 PM

Posting Permissions