Event Handlers

You can add event handlers that are invoked on the server to Web server controls. the Button control can include a Click event; the DropDownList offers the event SelectedIndexChanged, and the TextBox offers the event TextChanged.

The events occur on the server only when a postback occurs. When a value in a text box changes, the TextChanged event doesn't occur immediately; instead, the TextChanged event only occurs when the form is submitted and sent to the server, which happens when the Submit button is clicked. The ASP.NET runtime verifies that the state of the control has changed to invoke the corresponding event handler. If the selection of the DropDownList has been changed, the SelectedIndexChanged event is invoked; the TextChanged event is invoked accordingly when the value of a text box changes.

Note

If you want a change event immediately posted to the server (for example, when the selection of a DropDownList changes), you can set the AutoPostback property to true. This way a client-side JavaScript is used to submit the form data immediately to the server. Of course, network traffic is increased this way. Use this feature with care.

Verification of the old values with the new values of the controls is done by the ViewState. ViewState is a hidden field that is sent with the page content to the browser. When sending the page to the client, the ViewState contains the same values as the controls within a form. With a postback to the server, the ViewState is sent to the server together with the new values of the controls. This way it can be verified if the values changed, and the event handler can be invoked.

Up to now, the sample application has sent only a simple page to the client. Now, you need to deal with the result from the user input. In the first example, the user input is displayed in the same page, and then a different page is used. In the following Try It Out, you display the user input.

Try It Out – Display the User Input

1. Open the previously created Web application EventRegistrationWeb using Visual Studio 2005.

2. To display user input for the event registration, add a label with the name labelResult to the Web page Default.aspx.

3. Double-click the Submit button to add a Click event handler to this button and add this code to the handler in the file Default.aspx.cs:

   public partial class _Default: System.Web.UI.Page {    protected void buttonSubmit_Click(object sender, EventArgs e)    { string selectedEvent = dropDownListEvents.SelectedValue; string firstname = textFirstname.Text; string lastname = textLastname.Text; string email = textEmail.Text; labelResult.Text = firstname + " " + lastname +  "selected the event " + selectedEvent;    } }

4. Start the Web page using Visual Studio again. After you enter the data and click the Submit button, the same page will show up to display the user input in the new label.

How It Works

Double-clicking the Submit button adds the OnClick attribute to the <asp:Button> element in the file Default.aspx:

<asp:Button  Runat="server" Text="Submit"     OnClick="buttonSubmit_Click" />

With the Web server control, OnClick defines the server-side Click event that will be invoked when the button is clicked.

Within the implementation of the buttonSubmit_Click() method, the values of the controls can be read by using properties. dropDownListEvents is the variable that references the DropDownList control. In the ASPX file, the ID is set to dropDownListEvents, so a variable is automatically created. The property SelectedValue returns the current selection. With the TextBox controls the Text property returns the strings that have been entered by the user.

string selectedEvent = dropDownListEvents.SelectedValue; string firstname = textFirstname.Text; string lastname = textLastname.Text; string email = textEmail.Text;

The label labelResult again has a Text property where the result is set:

labelResult.Text = firstname + " " + lastname +       "selected the event " + selectedEvent;

Instead of displaying the results on the same page, NET 2.0 makes it easy to display the results in a different page, as you see in the following Try It Out.

Try It Out – Display the Results in a Second Page

1. Create a new WebForm with the name ResultPage.aspx.

2. Add a label to the ResultPage with the name labelResult.

3. Add code to the Page_Load method to the class ResultPage_aspx as shown here:

   public partial class ResultPage: System.Web.UI.Page {    protected void Page_Load(object sender, EventArgs e)    { try { DropDownList dropDownListEvents =  (DropDownList)PreviousPage.FindControl("dropDownListEvents"); string selectedEvent = dropDownListEvents.SelectedValue; string firstname =  ((TextBox)PreviousPage.FindControl("textFirstname")).Text; string lastname =  ((TextBox)PreviousPage.FindControl("textLastname")).Text; string email = ((TextBox)PreviousPage.FindControl("textEmail")).Text; labelResult.Text = firstname + " " + lastname  + " selected the event " + selectedEvent; } catch { labelResult.Text = "The originating page must contain " +  "textFirstname, textLastname, textEmail controls"; }    } }

4. Set the Default.aspx page's Submit button's PostbackUrl property to ResultPage.aspx.

5. You can remove the Click event handler of the Submit button because it is not required anymore.

6. Start the Default.aspx page, fill in some data and click the Submit button. You will be redirected to the page ResultPage.aspx, where the entered data is displayed.

How It Works

With ASP.NET 2.0 the Button control has a new property PostbackUrl to define the page that should be requested from the Web server. This property creates client-side JavaScript code to request the defined page with the client-side onclick handler of the submit button:

<input type="submit" name="buttonSubmit" value="Submit"     onclick="javascript:webForm_DoPostBackWithOptions(       new WebForm_PostBackOptions(&quot;buttonSubmit&quot;,           &quot;&quot;, false, &quot;&quot;, &quot;ResultPage.aspx&quot;,           false, false))"  /> 

The browser sends all the data from the form inside the first page to the new page. However, inside the newly requested page it is necessary to get the data from controls that have been defined with the previous page. With .NET 2.0 the Page class has a new property, PreviousPage, to access values from these controls. PreviousPage returns a Page object, where the controls of this page can be accessed using the FindControl() method. FindControl() is defined to return a Control object, so you must cast the return value to the control type that is searched.

DropDownList dropDownListEvents =    (DropDownList)PreviousPage.FindControl("dropDownListEvents");

Instead of using the FindControl() method to access the values of the previous page, the access to the previous page can be strongly typed that is less error-prone during development. To make this possible, a custom struct that is returned with a property from the default_aspx class is defined in the next Try It Out.

Try It Out – Create a Strongly Typed PreviousPage

1. Create the App_Code folder in the Web application by selecting the Web folder in the Solution Explorer, and selecting the menu Website Add ASP.NET Folder App_Code.

2. In the Solution Explorer, select the App_Code folder and add a new C# file using Website Add New Item Class, with the name RegistrationInformation.cs.

3. Implement the struct RegistrationInformation in the file RegistrationInformation.cs as shown:

    public struct RegistrationInformation { private string firstname; public string Firstname { get { return firstname; } set { firstname = value; } } private string lastname; public string Lastname { get { return lastname; } set { lastname = value; } } private string email; public string Email { get { return email; } set { email = value; } } private string selectedEvent; public string SelectedEvent { get { return selectedEvent; } set { selectedEvent = value; } } } 

4. Add the public property RegistrationInformation to the class Default_aspx in the file Default.aspx.cs:

    public RegistrationInformation RegistrationInformation { get { RegistrationInformation ri = new RegistrationInformation(); ri.Firstname = textFirstname.Text; ri.Lastname = textLastname.Text; ri.Email = textEmail.Text; ri.SelectedEvent = dropDownListEvents.SelectedValue; return ri; } } 

5. Add the PreviousPageType directive to the file ResultPage.aspx following the Page directive:

   <%@ Page Language="C#" AutoEventWireup="true" CodeFile="ResultPage.aspx.cs"    Inherits="ResultPage" %> <%@ PreviousPageType VirtualPath="~/Default.aspx" %> 

6. Within the Page_Load() method of the class ResultPage_aspx now the code can be simplified:

   protected void Page_Load(object sender, EventArgs e) {    try    { RegistrationInformation ri = PreviousPage.RegistrationInformation; labelResult.Text = ri.Firstname + " " + ri.Lastname  + " selected the event " + ri.SelectedEvent;    }    catch    {       labelResult.Text = "The originating page must contain " +              "textFirstname, textLastname, textEmail controls";    } }