Section 19.3. Creating a Web Form

19.3. Creating a Web Form

To create the simple Web Form that will be used in the next example, start up Visual Studio .NET and select File New Web Site . In the New Web Site menu , choose C# as your language, and choose ASP.NET Web Site as the template to use. Finally, locate your web site somewhere on your disk (at the bottom of the dialog), as shown in Figure 19-1.

Figure 19-1. Creating a new web site

Visual Studio creates a folder named Learning C Sharp Web in the directory you've indicated, and within that directory, it creates your Default.aspx page (for the User interface), Default.aspx.cs (for your code), and a Data directory (currently empty, but often used to hold data files).

19.3.1. Code-Behind Files

Code-behind is the default coding model used by Visual Studio 2005. When a new web site is created, Visual Studio automatically creates two files: the content file, with a default name , such as Default.aspx , and a code-behind file with a matching name, such as Default.aspx.cs ( assuming you are using C# as your programming language). If you change the name of the content file (highly recommended), the code-behind file will automatically assume the new name.

ASP.NET 1.1 programmers take note : the code-behind model for ASP. NET has changed. In Versions 1.0, the code-behind file defined a class that derived from Page . This code-behind class contained instance variables for all the controls on the page, with explicit event binding using delegates and the .aspx page derived from the code-behind class.

In Version 2.0, ASP.NET generates a single class from the combined .aspx page and partial class definitions in the code-behind file.

ASP.NET can infer the control instances and derive event bindings from the markup during compilation; thus, the new code-behind file includes only the application code you need, such as event handlers, and doesn't need to include instance variables or explicit event binding. The new code-behind files are simpler, easier to maintain, and always in sync with the .aspx page.

Let's take a closer look at the .aspx and code-behind files that Visual Studio creates. Start by renaming Default.aspx to HelloWeb.aspx . To do this, close Default.aspx , and then right-click its name in the Solution Explorer. Choose Rename and enter the name HelloWeb.aspx. That renames the file, but not the class. To rename the class, right-click the .aspx page and choose View Code in the code page, then rename the class from _Default to HelloWeb. You'll see a small line next to the name, as shown in Figure 19-2.

Figure 19-2. Changing the class name

Click it and you'll open the smart tag that allows you to rename the class. Click Rename "_default" to "HelloWeb," and Visual Studio ensures that every occurrence of _Default is replaced with its new name, as shown in Figure 19-3.

Figure 19-3. Using Visual Studio to rename the class

You will be warned that references in "markup" will not be changed. This means that you must manually update the name of the class in the .aspx file:

 <%@ Page Language="C#" AutoEventWireup="true"     CodeFile="HelloWeb.aspx.cs"  Inherits="HelloWeb"  %>

Within the HTML view of HelloWeb.aspx , you see an HTML form tag within the body of the page, like this:

 <form id="Form1" runat="server">

This tag specifies the form to use for your page. Web Forms assumes that you need at least one form to manage the user interaction, and creates one when you open a project. The attribute runat="server" within the form tag is the key to the server-side magic. Any tag that includes this attribute is considered a server-side control to be executed by the ASP.NET framework on the server. Visual Studio has placed div tags in the form to facilitate placing your controls and text.

Look for the title tag and change it to "Hello Web"it makes the browser window look nicer, as you'll see in just a moment.

Having created an empty Web Form, the first thing you might want to do is add some text to the page. By switching to HTML view, you can add script and HTML directly to the file just as you could with classic ASP. Adding the following line to the body segment of the HTML page (between the opening and closing div tags) will cause it to display a greeting and the current local time:

 Hello World! It is now <% = DateTime.Now.ToString(  ) %>

The <% and %> marks surround snippets of C# code. The = sign immediately following the opening tag causes ASP.NET to display the value, just like a call to Response.Write( ) that is, it writes directly to the HTML page. You could just as easily write the line as:

 Hello World! It is now     <% Response.Write(DateTime.Now.ToString(  )); %>

Run the page by pressing F5 (or save it and navigate to it in your browser). You should see the string printed to the browser, as in Figure 19-4.

Figure 19-4. Hello World from ASP.NET 2.0

19.3.2. Enabling Debugging

When you press F5, you begin the debugger. It's likely that Visual Studio will notice that you don't have a Web.config file for this application (which is required for debugging), and the Debugging Not Enabled dialog box will appear, as shown in Figure 19-5.

The default in this dialog box is to modify (and if needed, create) the Web.config file. Go ahead, and press OK to enable debugging for your application.