While I'm writing code for implementing ASP.NET 2.0 features in 1.1, I thought I'd provide another simple example. In this article, I will demonstrate a method for implementing the Focus() method which will automatically set the focus to a specified control when the page loads. The code examples in the article are written in C# and JavaScript. The entire project is available for download at the bottom of this article.

Before getting into the example, it is important to note that setting the automatically setting the focus is a client side action. Setting the focus requires manipulating the rendered page's document object model (DOM). DOM manipulation is typically performed through JavaScript to support cross-browser functionality although VBScript may be used. Because this example uses inheritance, you may want to review the topic before proceeding if you are unfamilar with it.

To specify a default control on the server, a few easy steps must be followed:

1. Create the BasePage class that overrides OnPreRender() and includes the Focus() method
2. Set the Web form to derive from BasePage
3. Call the Focus() method

The BasePage class will extend the functionality of System.Web.UI.Page to include a private field, the Focus() method, and additional functionality in PreRender().

using System;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;

namespace AutoFocus
{
  public class PageBase : System.Web.UI.Page
  {
    // Declare a string to hold the ClientID of the default control
    private string defaultFocus = String.Empty;

    // Focus() sets the value of the private field
    // Focus() is defined as public to ensure that it is accessible
    // from User Controls

    public void Focus(string controlID)
    {
      defaultFocus = controlID;
    }

    protected override void Render(HtmlTextWriter writer)
    {
      // Verify that a default control has been specified and a StartupScript
      // named __AutoFocus does not already exist

      if(defaultFocus != String.Empty &&
        !Page.IsStartupScriptRegistered("__AutoFocus"))
      {
        // Define the script to be output to the client.  The JavaScript simply
        // attempts to gain a reference to the control named by defaultFocus.
        // If a reference is obtained, focus() is called on that control

        StringBuilder scriptText =
          new StringBuilder("<SCRIPT language=\"JavaScript\">\n<!--\n");
        scriptText.Append(
          String.Format("\tvar obj = document.getElementById(\"{0}\");\n",
            defaultFocus));
        scriptText.Append("\tif(obj != null)\n");
        scriptText.Append("\t\tobj.focus();\n");
        scriptText.Append("//-->\n</scr" + "ipt>");

        // Register the script to execute after the page has loaded.
        Page.RegisterStartupScript("__AutoFocus", scriptText.ToString());
      }

      base.Render(writer);
    }

  }
}

Assume that a login page exists with three controls, a text box for the user name (UID), a text box for the password (PWD), and a login button (login). The default control should be the user name (UID) textbox. In order to accomplish this, we need to change the base type of the form to PageBase.

public class Login : PageBase  // PageBase replaces System.Web.UI.Page
{
  protected System.Web.UI.WebControls.TextBox UID;
  protected System.Web.UI.WebControls.TextBox PWD;
  protected System.Web.UI.WebControls.Button login;

  private void Page_Load(object sender, System.EventArgs e)
  {
    // Page_Load code
  }

  // Remaining page code
}

Only one easy task remains to implement the Focus() method in ASP.NET 1.1.

The Focus() method defined in PageBase must be called in order to render the AutoFocus script. Because Focus() is a member of BasePage and Login derives from PageBase, only one line of code is needed. This example makes the call in Page_Load but other locations would function too.

private void Page_Load(object sender, System.EventArgs e)
{
  Focus("UID");    // OR Focus(UID.ClientID);
  // Page_Load code
}

The above examples show how easy it is to implement a default control on any page by defining a new base type for the pages in the site. By inheriting from the new type, other ASP.NET 2.0 functionality such as Eval() and Master Pages are made possible.

Download [AutoFocus.ZIP ~15K]