Measuring programming progress by lines of code is like measuring aircraft building progress by weight. --Bill Gates

Set Initial Focus on an ASP.NET Page

Easily generate the Javascript to set focus to any control on your ASP.NET page

Summary

Setting the cursor focus to a particular element of a web page when it loads is a pretty common little feature, but it can be annoying to implement. Here I automated the process in a C# method. You only need to pass the Control to the method and it will register the Javascript and set focus on page load.

This code was adapted from work by Fons.Sonnemans@reflectionit.nl.

Setup a couple of text boxes to test by adding the following to your aspx page.

Example: How to use the SetInitialFocus method

<P><asp:TextBox id="TextBox1" runat="server"></asp:TextBox>
<P><INPUT id="htmlTextBox" type="text" runat="server">

Then call the following method from the Page_Load in the code behind file. Notice that this works for WebControls and HtmlControls.

Example: How to use the SetInitialFocus method

public void TestSetInitialFocus()
{
   //Snippets00004.SetInitialFocus(TextBox1);
   Snippets00004.SetInitialFocus(htmlTextBox);
}

If you load the test aspx page in your browser, you should see that the selected control has the cursor focus.

Here's the class:

The SetInitialFocus method embedded in a class.

namespace Cambia.CoreLib
{
   using System;
   using System.Text;
   using System.Web.UI;
   using System.Web.UI.WebControls;

   /// <summary>
   /// Useful C# snippets from CambiaResearch.com
   /// </summary>
   public class Snippets00004
   {

      public Snippets00004()
      {
      }

      public static void SetInitialFocus(Control control) 
      {
         if (control.Page.IsClientScriptBlockRegistered("InitialFocus"))
            return;

         if (control.Page == null) 
         {
            throw new ArgumentException(
               "The Control must be added to a Page before "
               + "you can set the IntialFocus to it.");
         }
         if (control.Page.Request.Browser.JavaScript == true) 
         {
            // Create JavaScript
            StringBuilder s = new StringBuilder();
            s.Append("\n<SCRIPT LANGUAGE='JavaScript'>\n");
            s.Append("<!--\n");
            s.Append("function SetInitialFocus()\n");
            s.Append("{\n");
            s.Append("   document.");

            // Find the Form
            Control p = control.Parent;
            while (!(p is System.Web.UI.HtmlControls.HtmlForm))
               p = p.Parent;
            s.Append(p.ClientID);

            s.Append("['");
            s.Append(control.UniqueID);

            // Set Focus on the selected item of a RadioButtonList
            RadioButtonList rbl = control as RadioButtonList;
            if (rbl != null) 
            {
               string suffix = "_0";
               int t = 0;
               foreach (ListItem li in rbl.Items) 
               {
                  if (li.Selected) 
                  {
                     suffix = "_" + t.ToString();
                     break;
                  }
                  t++;
               }
               s.Append(suffix);
            }

            // Set Focus on the first item of a CheckBoxList
            if (control is CheckBoxList) 
            {
               s.Append("_0");
            }

            s.Append("'].focus();\n");
            s.Append("}\n");

            if (control.Page.SmartNavigation)
               s.Append("window.setTimeout(SetInitialFocus, 500);\n");
            else
               s.Append("window.onload = SetInitialFocus;\n");

            s.Append("// -->\n");
            s.Append("</SCRIPT>");

            // Register Client Script
            if (!control.Page.IsClientScriptBlockRegistered("InitialFocus"))
               control.Page.RegisterClientScriptBlock("InitialFocus", 
                  s.ToString());
         }
      }

   }
}
comments powered by Disqus