We’re happy to announce that Michael Halvorson’s Microsoft Visual Basic 2010 Step by Step (ISBN: 9780735626690; 576 pages; ebook included) is now available.
You can find the book’s chapter-level “Contents at a Glance” and Introduction here.
In this post we share a stretch of sample text from Chapter 20, “Creating Web Sites and Web Pages by Using Visual Web Developer and ASP.NET.”
Creating Web Sites and Web Pages by Using Visual Web Developer and ASP.NET
After completing this chapter, you will be able to:
■ Start Visual Web Developer and create a new Web site.
■ Use Visual Web Developer tools and windows, including the Web Page Designer.
■ Use the Visual Web Developer Toolbox to add server controls to Web pages.
■ Add text, formatting effects, and Visual Basic code to a Web page that calculates loan
payments for a car loan.
■ Create a Web page that displays Help information.
■ Use the HyperLink control to link one Web page to another on a Web site.
■ Use the GridView control to display a table of database information on a Web page.
■ Set the Title for a Web page and edit the master page.
In this chapter, you’ll learn how to build Web sites and Web pages by using the Visual Web
Developer tool included with Microsoft Visual Studio 2010. Visual Web Developer has the
look and feel of the Visual Studio Integrated Development Environment (IDE), but it is
customized for Web programming and Microsoft ASP.NET 4, the Microsoft .NET Framework
component designed to provide state-of-the-art Internet functionality. Although a complete
description of Web programming and ASP.NET isn’t possible here, there’s enough in common
between Web programming and Windows programming to allow you to do some useful
experimentation—even if you have little or no experience with Hypertext Markup Language
(HTML). Invest a few hours in this chapter, and you’ll see how quickly you can build a Web
site that calculates loan payments for car loans, create a Web page with Help information,
and display loan prospects from a Microsoft Access database by using the GridView control.
ASP.NET 4, Microsoft’s Web development platform, has been enhanced in this release.
Some of the improvements include how Web pages are created in the Web Page Designer;
various feature enhancements to ASP.NET Web pages and ASP.NET MVC; support for
recently introduced browsers and handheld devices; a new ASP.NET Chart server control;
enhancements to the FormView, ListView, and QueryExtender controls; new dynamic data
and XML) programming model. Although ASP.NET has some similarities with an earlier Web
programming technology named Active Server Pages (ASP), ASP.NET has been significantly
enhanced since its first release in Visual Studio .NET 2002, and continues to evolve as new
features are added to the .NET Framework and Visual Studio software. Visual Web Developer
is the tool that you use to create and manage ASP.NET user interfaces, commonly called Web
pages or (in a more comprehensive sense) Web sites.
Tip In programming books about ASP.NET, you’ll sometimes see Web pages referred
to as Web Forms and Web sites referred to as Web applications or
By using Visual Web Developer, you can create a Web site that displays a user interface,
processes data, and provides many of the commands and features that a standard
application for Windows might offer. However, the Web site you create is viewed in a
Web browser, such as Internet Explorer, Mozilla Firefox, Apple Safari, or even one of the
new mobile device types, including Google Chrome, the Research in Motion BlackBerry
smart phone, and the Apple iPhone. These Web sites are typically stored on one or more
Web servers, which use Microsoft Internet Information Services (IIS) to display the correct
Web pages and handle most of the computing tasks required by your Web site. (In Visual
Studio 2010, Web sites can also be located and run on a local computer that does not
require IIS, giving you more options for development and deployment.) This distributed
strategy allows your Web sites to potentially run on a wide range of Internet-based or
stand-alone computers—wherever your users and their rich data sources are located.
To create a Web site in Visual Studio 2010, you click the New Web Site command on the File
menu, and then use the Visual Web Developer to build one or more Web pages that will
collectively represent your Web site. Each Web page consists of two pieces:
■ A Web Forms page, which contains HTML, ASP.NET markup, and controls to create the
■ A code-behind file, which is a code module that contains program code that “stands
behind” the Web Forms page.
This division is conceptually much like the Windows Forms you’ve been creating in Microsoft
Visual Basic—there’s a UI component and a code module component. The code for both of
these components can be stored in a single .aspx file, but typically the Web Forms page code
is stored in an .aspx file, and the code-behind file is stored in an .aspx.vb file.
In addition to Web pages, Web sites can contain code modules (.vb files), HTML pages (.htm
files), configuration information (Web.config files), global Web application information
pages, and other components. You can use the Web Page Designer and Solution Explorer to
switch back and forth between these components quickly and efficiently.
Web Pages vs. Windows Forms
What are the important differences between Web pages and Windows Forms? To begin
with, Web pages offer a slightly different programming paradigm than Windows Forms.
Whereas Windows Forms use a Windows application window as the primary user interface
for a program, a Web site presents information to the user through one or more Web pages
with supporting program code. These pages are viewed through a Web browser, and you
can create them by using the Web Page Designer.
Like a Windows Form, a Web page can include text, graphic images, buttons, list boxes, and
other objects that are used to provide information, process input, or display output. However,
the basic set of controls you use to create a Web page is not the set on the Common Controls
tab of the Toolbox. Instead, ASP.NET Web sites must use controls on one of the tabs in the
Visual Web Developer Toolbox, including Standard, Data, HTML, and many others. Each of
the Visual Web Developer controls has its own unique methods, properties, and events, and
although there are many similarities between these controls and Windows Forms controls,
there are also several important differences. For example, the Visual Studio DataGridView
control is called GridView in Visual Web Developer and has different properties and methods.
Many Web page controls are server controls, meaning that they run on the Web server.
Server controls have an “asp” prefix in their tag. HTML controls (located on the HTML tab
of the Visual Web Developer Toolbox) are client controls by default, meaning that they run
only within the user’s browser. For now, however, you simply need to know that you can use
server controls, HTML controls, or a combination of both in your Web site projects. As you
gain experience in Web programming, you may want to investigate AJAX programming in
Visual Studio, which can enhance the efficiency of your Web applications and add advanced
user-interface elements for users.
Server controls are more capable than HTML controls and function in many ways like the
Windows Forms controls. Indeed, many of the server controls have the same names as the
Windows Forms controls and offer many of the same properties, methods, and events. In
addition to simple controls such as Button, TextBox, and Label, more sophisticated controls
such as Chart, FileUpload, LoginView, and RequiredFieldValidator are provided on a number
of tabs in the Toolbox; Visual Studio 2010 has added a number of controls to the list. The
screen shot on the following page shows a sample of the server controls in the Visual Web
Developer Toolbox. (Dynamic Data and Reporting controls are not shown.)
The HTML controls are a set of older user interface (UI) controls that are supported by all
Web browsers and conform closely to the early HTML standards developed for managing
UI elements on a typical Web page. They include Button, Text, and Checkbox—useful basic
controls for managing information on a Web page that can be represented entirely with HTML
code. Indeed, you might recognize these controls if you’ve coded in HTML before. However,
although they’re easy to use and have the advantage of being a “common denominator”
for Web browsers, they’re limited by the fact that they have no ability to maintain their own
state. (In other words, the data that they contain will be lost between views of a Web page.)
The following screen shot shows the HTML controls offered on the HTML tab of the Toolbox
in Visual Web Developer:
Building a Web Site by Using Visual Web Developer
The best way to learn about Visual Web Developer and ASP.NET is to get some hands -on
practice. In the exercises in this chapter, you’ll create a simple car loan calculator that
determines monthly payments and contains an About tab that explains how the program
works. Later in the chapter, you’ll use the GridView control to display a table of data on
a Web page in the same Web site. You’ll begin by verifying that Visual Studio is properly
configured for ASP.NET programming, and then you’ll create a new Web site project. Next,
you’ll use the Web Page Designer to create a Web page with text and links on it, and you’ll
use controls in the Visual Web Developer Toolbox to add controls to the Web page.
Considering Software Requirements for ASP.NET Programming
Before you can create your first ASP.NET Web site, you need to make sure your computer is
set up properly. To perform ASP.NET programming, you need to have Visual Web Developer
installed. Visual Web Developer is a component of Visual Studio 2010 Professional, Premium,
and more advanced editions. You can also download Visual Web Developer 2010 Express at
http://www.microsoft.com/express/Web/, and it contains
almost all the features described in this chapter (I’ll point out any differences as we go). If you
are using Visual Web Developer 2010 Express, be sure to set the settings to Expert by
clicking the Tools menu, clicking Settings, and then clicking Expert Settings. This will
ensure that the steps in this chapter more closely match your software.
Visual Studio 2010 and Visual Web Developer include their own local Web server, so setting up
and configuring a Web server with Microsoft Internet Information Services (IIS) and the .NET
Framework is not required. Having a local Web server makes it easy to create and test your
ASP.NET Web sites, and you’ll see it described below as the ASP.NET Development Server.
In Visual Studio 2010, you can create and run your Web site in one of three locations:
■ Your own computer (via the ASP.NET Development Server)
■ An HTTP server that contains IIS and related components
■ An FTP site (a remote file server)
The first location is the option we’ll use in this book because it requires no additional
hardware or software. In addition, when you develop your Web site on the local file system,
all the Web site files are stored in one location. When you’re finished testing the application,
you can deploy the files to a Web server of your choosing.