ASP.NET Web Forms

Regardless of your programming language choice, the structure of ASP.NET pages is the same. Almost every ASP.NET script page can be broken into the following components-Page Directives, Code Declaration Blocks, Code Render Blocks, and Web Forms. To demonstrate each component, let's dissect the sample ASP.NET VB.NET script file shown in Listing 14.1 and the ASP.NET C# script file shown in Listing 14.2. The result of both scripts is the same; you can see the C# output in Figure 14.1.

Listing 14.1: HELLOWORLD-VB.ASPX IN VB.NET

start example
<%@ Page Language="VB" ContentType="text/html" ResponseEncoding="iso-8859-1" %> <script runat="server">    Sub tbName_Change(Sender As Object, E As EventArgs)     lblWelcome.Text = "Hello " + tbName.Text    End Sub  </script>  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  <html> <head> <title>Hello World Form</title>  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  </head> <body> <form runat="server">   <label>Your Name:</label>   <asp:textbox  OnTextChanged="tbName_Change" runat="server"       TextMode="SingleLine" />   <asp:button  runat="server" Text="Enter" />   <asp:label  runat="server" ></asp:label>  </form> </body> </html>
end example

Listing 14.2: HELLOWORLD-CSHARP.ASPX IN C SHARP

start example
<%@ Page Language="C#" ContentType="text/html" ResponseEncoding="iso-8859-1" %> <script runat="server">      void tbName_Change(Object Sender, EventArgs E) {         lblWelcome.Text = "Hello " + tbName.Text;     } </script>  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html>  <head>  <title>Hello World Form</title>  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">  </head> <body> <form runat="server">    <label>Your Name:</label>   <asp:textbox  OnTextChanged="tbName_Change" runat="server"     TextMode="SingleLine" />   <asp:button  runat="server" Text="Enter" />   <asp:label  runat="server" ></asp:label>  </form> </body> </html>
end example

click to expand
Figure 14.1: Viewing the output from helloWorld- CSharp.aspx in Internet Explorer

 On the CD-Rom   We strongly encourage you to key in all the code to create the example files yourself. To check your work, compare your files with the example files on the CD accompanying this book.

The Page Directive

Beginning at the top of both script files you'll notice

<%@ Page Language="VB" ContentType="text/html" ResponseEncoding="iso-8859-1" %>

and

<%@ Page Language="C#" ContentType="text/html" ResponseEncoding="iso-8859-1" %> 

This is a Page Directive. You use Page Directives to tell ASP.NET how to handle the page. In this case, we've simply declared the type of programming language we'll be using throughout our page. In addition to declaring the default programming language of the page, you can also use Directives for many other tasks. Table 14.1 lists and explains the directives supported by ASP.NET.

Table 14.1: ASP.NET DIRECTIVES

Directive

Purpose

@ Page

Defines page-specific attributes used by ASP.NET. The Page Directive can only be used in .aspx files.

@ Control

Defines control-specific attributes used by ASP.NET. The Control Directive can only be included in user control .ascx files.

@ Import

Imports a namespace into an ASP.NET page or user control.

@ Implements

Indicates that an ASP.NET page uses a specific .NET framework interface.

@ Register

Defines and applies an alias to namespace and class names. Hereafter, the alias can be used to include user and server controls in a page or user control.

@ Assembly

Links an assembly to the ASP.NET page or user control.@ OutputCache Controls the output caching of an ASP.NET page or a user control.

@ Reference

Links a page or a user control to the ASP.NET page or user control.

The Code Declaration Block

If you're familiar with JavaScript, you'll recognize that the next line begins a Code Declaration Block. A Code Declaration Block is nothing more than a section of the page that contains programming code. A Code Declaration Block always begins with the <script> tag and ends with the </script>tag. However, in the case of ASP.NET, the programming code is compiled by the server. In ASP.NET, any code or object you want the ASP.NET server to handle should include the RUNAT="SERVER"parameter, as our beginning code block does. As you can see in the VB.NET and C# sample code, the Code Declaration Block is defining a subprocedure that changes the text of our lblWelcome label to the value of the tbName text field once the Submit button is clicked.

The VB.NET version of the declaration block looks like this:

<script runat="server">    Sub tbName_Change(Sender As Object, E As EventArgs)      lblWelcome.Text = "Hello " + tbName.Text    End Sub  </script> 

The C# version looks like this:

<script runat="server">    void tbName_Change(Object Sender, EventArgs E) {       lblWelcome.Text = "Hello " + tbName.Text;   }  </script>

The Code Render Block

If you're an ASP developer, you'll recognize the next line we call to your attention in both scripts:

<%= "Sample ASP.NET Script Page" %>

This line is referred to as a Code Render Block. There are two types, inline code and inline expressions. Inline code defines self-contained code blocks for more complex functions. Inline expressions are typically used as a shortcut for the RESPONSE.WRITE command, which outputs data to the HTML page. These types of Code Render Blocks were commonly mixed freely with HTML code in traditional ASP script files. However, ASP.NET script pages are more structured. ASP.NET script pages are typically organized with ASP.NET code at the top of the page and the user interface or presentation at the bottom of the page. Therefore, Code Render Blocks are of minimal use in ASP.NET. Still, they are handy to directly output a line, quickly declare a variable, or set a value.

The Web Form

The next block of lines demonstrates one of the most important concepts in ASP.NET-Web Forms. Web Forms are script pages that direct the server to dynamically generate HTML-compliant output to the target browser, such as a web browser or a mobile device. Web Forms provide much of the built-in web functionality of ASP.NET.

In addition, Web Forms allow developers to finally separate the visible portion of the page, the user interface or presentation, from the programming code and logic. The visual part of a Web Form is called the Page. The Page holds the HTML and ASP.NET server controls. The logic portion of the Web Form is held within Code Declaration Blocks that are compiled by the server.

Back in our sample ASP.NET script, notice that the <form> tag has the RUNAT="SERVER" parameter. This ensures that ASP.NET realizes this form is indeed a Web Form. When the server processes this Web Form, it translates it into HTML. For example, the Web Form looks like this in our example ASP.NET script file:

<form runat="server">   <label>Your Name:</label>   <asp:textbox  OnTextChanged="tbName_Change" runat="server"      TextMode="SingleLine" />   <asp:button  runat="server" Text="Enter" />   <asp:label  runat="server" >  </asp:label>  </form>

which is radically different from the following server-generated HTML that is sent to a web browser:

<form name="_ctl0" method="post" action="HelloWorld-CSharp.aspx" >  <input type="hidden" name="__VIEWSTATE" value="dDwxMzc4MDMwNTk1O3Q8O2w8aTwwPjs+O2_  w_8dDw_7bDxpPDE+O2k8NT47PjtsPHQ8cDxwPGw8VGV4dDs+O2w8Y_  XNkZnNkZjs+Pjs+Ozs+O3Q8cDxwPGw8VGV4dDs+O2w8SGV_  sbG8gYXNkZnNkZjs+Pjs+Ozs+Oz4+Oz4+Oz4P44crQ5YQM_ qdaLaCekXk+vypiEg==" />   <label>Your Name:</label>   <input name="tbName" type="text" value=""  />   <input type="submit" name="btSubmit" value="Enter"  />   <span ></span>  </form>

Note 

The above code has been formatted to fit the book page. The length of your lines of code may vary from what is shown here.

Within a Web Form you can place server controls, which are form controls the server can programmatically monitor and then react to the events that affect them. For example, when you view the ASP.NET form in your web browser, the text field, label tag, and Submit button are actually server controls that can react to events and even communicate with the server at any given time. With ASP.NET, you no longer have to wait for the user to submit a form to react to events.

For example, in a simple login form scripted in traditional ASP, the user enters their login name and password. They then click Submit to send the form to the server. The server validates the login name and password and responds with a success or failure message to the user. If you script the same login form using server controls and ASP.NET, you can set the Login textbox and the Password box to validate and return a success and failure message as soon as the user enters information. In short, past techniques limited server processing and responses to a form submission. ASP.NET allows your server to process and respond to any action occurring to any control or object on a web page.

However, notice that our sample <form> tag has no Action page specified. Without an Action page defined, the form submits the form data to itself. This is referred to as Postback Form and is common practice in ASP.NET. Also notice that the ASP.NET web server has added a hidden text box to the HTML form block. This hidden text field allows one of the best, albeit simplest, features of a Postback Form with HTML server controls-server controls within the form retain their value when the form is submitted. So, if you enter your name in the text box and submit the form to itself, ASP.NET automatically populates the text box with the submitted text box value. In traditional ASP, a developer had to include several lines of code to accomplish this.

In our example, you can see that the text box, button, and label all include the RUNAT="SERVER"

parameter specifying them as server controls. Also notice that the text box has an additional element that sets a call to the tbName_Change subprocedure declared in our Code Declaration Block. So, whenever the text box value is changed and the form is submitted, the subprocedure sets the value of the text box as the value of the label, as shown in Figure 14.2.

click to expand
Figure 14.2: An event-driven Web Form



Mastering Dreamweaver MX Databases
Mastering Dreamweaver MX Databases
ISBN: 078214148X
EAN: 2147483647
Year: 2002
Pages: 214

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net