Creating a full-fledged Web Forms application requires a reasonable amount of work, but creating a single form is quite simple. ASP.NET Web Forms applications can be created by using any text editor; however, Microsoft Visual Studio 2005 is generally the easiest tool to use.
To create an ASP.NET Web Forms application in Visual Studio 2005, click New on the File menu, and then click Web Site (rather than Project), as shown in Figure 1-1.
Figure 1-1: Creating a new Web site in Visual Studio 2005
The next dialog box allows you to further specify the exact type of Web site you want to create, as shown in Figure 1-2.
Figure 1-2: The New Web Site dialog box in Visual Studio 2005
This dialog box lists several installed templates. The templates listed when you create a new Web site will likely be different from the ones shown here. For this example, select the ASP.NET Web Site template. You can also specify a location (there is, however, more to this than just selecting a folder I will discuss this later in this chapter). In this example, I specified a file location different from the default location. If multiple programming languages are installed, you can also specify the language to use for the Web site. On my machine, running the Enterprise Architect version of Visual Studio 2005, I can create a Web site using Visual Basic .NET, C#, or J#. For the examples in this book, I will use C#. Click OK, and you will see a screen similar to the one shown in Figure 1-3.
Figure 1-3: A new Web Form in Visual Studio 2005 in Source view
If you click the Design tab at the bottom, the form design surface appears, as shown in Figure 1-4. (Source view, shown previously, will be described later in this chapter.)
Figure 1-4: A new Web Form in Design view
Note
The Web page created by Visual Studio when you create a Web site is named Default.aspx. By default, when you create code for the page, Visual Studio creates a file with the same name as the Web page, with .cs (or .vb for Visual Basic .NET pages) as the extension. Thus, the file with code for Default.aspx is named Default.aspx.cs. Note that this is not a requirement, just a convenient convention.
Another thing to note is that nothing in ASP.NET requires you to place the code in another file (commonly called a codebehind file). Visual Studio .NET 2003 and earlier versions essentially required you to use codebehind files. Visual Studio 2005, however, gives you the option to include all the code in the .aspx file. Unlike earlier versions, Visual Studio 2005 even allows the use of IntelliSense technology when working with code inside the .aspx page. When you create a new Web Form, clear the Place Code In A Separate File check box to have all code in the .aspx file.
In Design view, you can drag and drop controls onto the form. Note, though, that unlike Windows Forms, there is no convenient grid to help you align controls. For example, if you drag a label, text box, and button onto a Web Form, the controls (by default) do not stay exactly where you drop them. They move to the upper left of the screen.
Note
Visual Studio .NET 2003 and earlier versions allowed you to set a page up for grid layout. When a Web Form was set for grid layout, controls dropped onto a Web Form stayed exactly where they were put. Visual Studio 2005 eliminates this option. Grid layout may sound like a great idea if you are used to Windows Forms development. In reality, it is a terrible way to lay out a Web Form. When grid layout is used, each control contains a style element that hard-codes the location of the control. Given the extremely different screen geometry of the various Web browsers, using this exact positioning, rather than more HTML- friendly ways (such as tables and cascading style sheets), allows you to create forms that do not travel well. For instance, a form laid out with a rigid format that looks great on your desktop PC will look terrible on a mobile device's browser. Chapter 3 will cover Web Form layout in detail.
The result of dropping the three controls onto a Web Form in Visual Studio 2005 is shown in Figure 1-5.
Figure 1-5: A Web Form with a label, text box, and button
Obviously, this is not an ideal layout for a form. To solve this problem in Design view, you can click to the right of the button, press the Left Arrow key so that the cursor appears between the button and the text box, and then press Enter to move the button to a second line (aligned with the left margin). You can do the same to move the text box down onto its own line. The screen should look something like Figure 1-6.
Figure 1-6: A Web Form with a label, text box, and button aligned on the left
This is better, but of course not as good as it can get. It is, however, worth looking at the Web Form in Source view, by clicking the Source tab, as shown in Figure 1-7.
Figure 1-7: The Web Form in Source view
Auto Hide Mode
The following screens show the Solution Explorer window and the Properties window. In Auto Hide mode, a window is represented by a tab on one side of the screen. To enable Auto Hide mode, do the following:
Rest the mouse pointer on the Auto Hide button (with the push-pin icon) in the title bar of the Solution Explorer window. See the arrow shown here.
Click the Auto Hide button, and the Solution Explorer window appears as a tab in the right margin, as shown here. (Note that the Properties window now fills the right pane.)
Repeat the process for the Properties window (locate and click the Auto Hide button).
Using the Auto Hide feature to show or hide these two windows might be helpful to you, depending on the screen resolution of your development machine.
If you had looked at the Source view of the Web page before you aligned the three controls, you would have seen a single difference. Although each of the controls (identified by a tag beginning with <asp:) was already on a separate line, the <br /> tags would not have been there. The <br /> tags were added by Visual Studio when the Enter key was pressed in Design view. The fact that a literal carriage return had no effect on the display in Design view and the <br /> tags did illustrates a very important characteristic of Web Forms. A Web Form is persisted using a markup language.
Much of the markup in Default.aspx shown in Figure 1-7 was placed there by Visual Studio. An important bit of markup is in the first line of the source.
This type of line in ASP.NET is called a directive, and this line specifically is called an @Page directive. The following table describes the common attributes of the @Page directive.
Table 1-1: Common @ Page Directive Attributes
Attribute
Description
AspCompat
Indicates whether the page must be executed in a single-threaded apartment, which allows COM components created by tools such as Visual Basic 6.0 to run on your page. Running single-threaded apartment COM components in an ASP.NET page is a very bad idea, because it can seriously degrade the performance of your page.
AutoEventWireup
Indicates whether the events on the page are automatically assigned based on the names of the events. The default value is true.
CodeFile
Indicates the name of the file that contains the code for the page.
Debug
Indicates whether the page should be compiled with debug symbols. The value can be true or false.
ErrorPage
Defines a target URL to redirect to when an unhandled error occurs.
Language
Specifies the language used to compile code blocks associated with the page.
SmartNavigation
Indicates whether the page supports the smart navigation feature of Microsoft Internet Explorer. The value can be true or false. Although this feature, which returns users to the same place on a page after a post-back, can sometimes be useful, it can be a less-than-perfect solution in practice.
ValidateRequest
Indicates whether request validation should occur. The value can be true or false. The default is true. If ValidateRequest is true, and a user enters any HTML markup (that is, as text containing <, >, and so on) into a text box, an exception is thrown. The exception is thrown because text containing those characters could be used for cross-site scripting attacks. You must set the value to false if the user is expected to enter markup in a text box.
