74 |
Saturday Morning |
Hmmmm . . . That’s weird. Where did all of this extra source code come from, and what function does it perform? Let us explain . . .
How HTML controls work
All of the HTML code that was added came from the ASP.NET engine. Each of these additions are being used by the ASP.NET engine to maintain state across client requests. Absolutely no state is maintained on the server using session variables — definitely a plus for scalability.
The hidden __VIEWSTATE field is used to maintain control state and the value is actually a compressed and encrypted value. Typically, you probably won’t be able to make much sense of it. But that’s OK because ASP.NET handles all of the details for you.
Cross-Ref
The __VIEWSTATE form field is used to maintain control state, not user state. User state management will be discussed in Session 12, “Maintaining State in ASP.NET.”
When an ASP.NET page is requested from the server, several things happen relating to HTML controls. First, the aspx page tries to determine whether the page is a post back. If it is, the __VIEWSTATE property is examined, the posted data is processed, and state is applied to the forms elements. All the __VIEWSTATE field does is contain data about control state when the HTML page is generated.
Put in very simplistic terms, this is what happens. No magic, just some processing that is transparent to the developer.
Intrinsic HTML controls
As demonstrated in the previous example, the HTML select object can be used as an ASP.NET HTML control. So you may be wondering what other elements can be ASP.NET HTML controls. Each of the following elements can be used as HTML controls:
<form> |
<td> |
<select> |
<th> |
<img> |
<a> |
<textarea> |
<button> |
<table> |
<tr> |
<input> (checkbox, image, hidden, file, button, text, submit, radio button)
HTML Control Events
Handling HTML control events is a straightforward process. We can use one of two approaches to handling events:
1.Utilize the ASP.NET Page_Load event.
2.Create custom event handlers.
Session 8—Using HTML Controls |
75 |
ASP.NET’s Page object provides you with a facility for handling events on the server side using the Page_Load event. Handling events using the Page_Load event requires you to write some code that first checks to see if the request is a post back and then performs the appropriate actions.
The Page_OnLoad event
Listing 8-4 demonstrates how you can handle HTML control events with the Page_OnLoad event.
Listing 8-4 Using HTML control events with the Page_OnLoad event
<script runat=”server” language=”VB”>
Sub Page_Load(Sender As Object, E As EventArgs) If Page.IsPostBack Then
Select cmbPeople.value Case “Bill Gates”
Response.Redirect(“http://www.microsoft.com”) Case “Larry Ellison”
Response.Redirect (“http://www.oracle.com”) Case “Steve Case”
Response.Redirect (“http://www.aol.com”) Case Else
End Select End If
End Sub </script> <html> <body>
<form id=”frmPeople” method=”post” runat=”server”> People<br>
<select id=”cmbPeople” runat=”server”> <option></option>
<option>Bill Gates</option> <option>Larry Ellison</option> <option>Steve Case</option>
</select><br>
<input type=”submit” value=”Submit”> </form>
</body>
</html>
You’ll notice at the top of this page a function called Page_Load is invoked. This function is called each time the page is requested by a client. You must check to see whether the page request is a post back (that is, a form has been submitted) by using the Page object’s IsPostBack property. If the IsPostBack property returns true, you can check the submitted values — in this case, the value of the cmbPeople select element.
With ASP.NET we can check the value of a form element using its value property. We no longer need to use the Request.Form syntax.
Note
76 |
Saturday Morning |
The rest of the code is straightforward. Use Visual Basic’s Select control structure to redirect the user to a Web site depending on the value selected. Remember that this code is being handled on the server side, so the browser used by the client is inconsequential.
Custom event handlers
In order to create a custom event handler, you need to do two things:
Create a subroutine that will act as the event handler.
Wire an HTML control to call the event handler on the server side.
In the following example, we will create a subroutine called Sample_Handler to handle event processing. This subroutine will be called by the Submit button by simply adding the following the runat=”server” and onserverclick=”Sample_Handler” attribute/value pairs to the control declaration as follows:
<input type=”submit” value=”Submit” id=”smbSubmit” runat=”server” onserverclick=”Sample_Event”>
That’s all you have to do. Listing 8-5 shows the entire page:
Listing 8-5 Using a custom event handler
<script runat=”server” language=”VB”>
Sub Sample_Handler(Sender As Object, E As EventArgs) Select cmbPeople.value
Case “Bill Gates”
Response.Redirect (“http://www.microsoft.com”) Case “Larry Ellison”
Response.Redirect (“http://www.oracle.com”) Case “Steve Case”
Response.Redirect (“http://www.aol.com”) Case Else
End Select End Sub </script> <html> <body>
<form id=”frmPeople” method=”post” runat=”server”> People<br>
<select id=”cmbPeople” runat=”server”> <option></option>
<option>Bill Gates</option> <option>Larry Ellison</option> <option>Steve Case</option>
</select><br>
<input type=”submit” value=”Submit” id=”cmbSubmit” runat=”server” onserverclick=”Sample_Handler”>
</form>
</body>
</html>