Chapter 20

1
Chapter 20 Creating Web Projects

• Microsoft Visual Basic .NET, Introduction to
  Programming

2
Important

• The projects ASP.NET in this lesson can be in
• a Web server running Microsoft Internet
  Information Services (IIS) server
• FTP server
• Local File Drive.

3
Objectives

• Create an ASP.NET Web Application project.
• Mix both Web forms server controls and standard
  HTML controls on a Web page.
• Work with grid layout and flow layout modes in
  the Web forms Designer.
• Populate an HTML table with data generated from
  code in a Web page.
• Manipulate dates.

4
Vocabulary

• ASP.NET
• Code-behind file
• Grid layout mode
• Flow layout mode
• Platform
• Server controls
• Web forms
• Web server

5
Putting Projects on the Web

• Hypertext Markup Language (HTML) is used to
  build Web pages. It is a language that is at the
  same time both simple and sophisticated. To get
  an idea of what HTML is like, open any Web page
  in Internet Explorer and click View Source. The
  HTML source used to build the page you see in the
  browser is shown in a simple text editor.
• When you request a Web page, the HTML source is
  used by the Web server to build the page and send
  it to your machine. The Web server is the
  computer used to process Web page requests. The
  server is part of the network of computers that
  form the Internet.

6
ASP.NET

• Microsofts solution for putting applications on
  the Web is built around ASP.NET. ASP stands for
  Active Server Pages. Active server pages are Web
  pages whose display is actively managed and
  altered by the Web server. ASP.NET is a platform
  from which Web applications are run. A platform
  is the combination of hardware and operating
  system on which applications are run. ASP.NET
  contains controls and objects with which to build
  Web pages, as well as a run-time system that
  executes the pages on the Web server. For
  database access, ASP.NET uses ADO.NET, the same
  system you have already used in this book to
  access databases.

7
Web Application

• To create a Web application using Visual Basic,
  open a new ASP.NET Web Application project using
  its template in the New Project window.

8
Web Forms

• A Web project is composed of static HTML pages,
  like the HTML file you created in Lesson 13, and
  Web forms.
• Web forms are built from the ASP.NET Page class.
  Objects created with this class are containers
  for controls and HTML. The controls placed on Web
  forms are part of the ASP.NET framework and
  provide the kind of functionality you are used to
  seeing in interactive Web pages. The controls and
  other graphic elements of the Web form are
  contained in an .aspx file. The code that runs
  the show is contained in a second file, a class
  file with extension .vb.

9
Grid Layout Mode

• The WYSIWYG (what you see is what you get) view,
  grid layout mode, is the actual appearance of the
  Web form. This view, although somewhat different
  from the environment you have used to create
  Windows applications, is the easiest to use. You
  position controls on the form just as you did for
  Windows forms.

10
Flow Layout Mode

• Flow layout mode shows the HTML code thats
  executed from top to bottom to build the
  appearance of the Web page. You may work on the
  design of the form in either view or switch
  between the views.
• If you make a change in one view, the changes
  you make will be immediately visible when you
  switch to the other view.

11
Server Controls

• The controls added to a Web form are called
  server controls. These controls are similar to
  the Toolbox controls you add to a Windows form.
  However, server controls differ from those you
  add to a Windows form in that they are run on the
  Web server, Local Drive, FTP server after the Web
  page is posted to the clients computer.

12
New Project Window Showing the Selection of
ASP.NET Web Application
13
Solution Explorer Showing Files Created for the
Amortization Table Web Application
14
Note

• Although the names of the HTML controls and the
  Web Forms server controls may seem to indicate
  overlapping functions, HTML controls are not
  executed by the server unless they are
  intentionally converted to server controls.

15
Note

• Click Build and Browse any time you want to see
  the effect of your changes on the current version
  of the Web page.

16
Note

• The color number, 9933cc, is expressed in base
  16, hexadecimal notation. The first two digits,
  99, refer to the amount of red in the color. The
  second two digits, 33, refer to the amount of
  green. The last two digits, cc, refer to the
  amount of blue. In base 16, the letter c
  represents the single digit number, 12. Each pair
  of digits can express values from 0 to 255,
  giving 256 levels of red, green, and blue. Each
  pair of hexadecimal digits is equivalent to 8
  binary digits, or bits. Together, each color is
  specified as a 24-bit value.

17
Amortization Web Page Showing Final Placement of
Controls
18
Amortization Web Page Displaying a Monthly
Payment of 672.09
19
Amortization Web Page Running in a Browser
20
Adding a Table to a Web Page

• The lttablegt tag creates a table with no rows and
  no cells. Information in the table must appear in
  a cell which, in turn, must appear in a row. Like
  other Visual Basic controls, a table is built
  from a collection a collection of rows. Each
  row is a collection of cells.

21
Tables

• The following statements would add a table to
  the Web page, but you would not be able to
  position the table on the page in any particular
  place.
• lttable gt
• lttrgt
• lttdgt This is the first cell of Row 1 lt/tdgt
• lttdgt This is the second celllt/tdgt
• lt/trgt
• lt/tablegt

22
Table Tag

• lttable cellSpacing"2" cellPadding"4"
  width"635" border"10" gt

23
Result of Adding a Few Attribute Values to the
lttablegt Tag
24
Turning an HTML Control into a Server Control

• To turn an HTML table into a server control, add
  the following attributes to the lttablegt tag
• id"tblAmort" runat"server"

25
Dealing with Dates

• The Date data type represents both dates and
  times. The range of possible dates is from
  January 1, the year 1 to December 31, the year
  9999. To assign a particular date to a date
  variable, enclose the date of the form m/dd/year
  with number signs ().
• Dim TodaysDate As Date
• TodaysDate 5/27/2002

26
Dealing with Dates

• The first statement below shows the declaration
  and initialization of CurrentDate, the date
  variable. The second line writes the current date
  into the innerText property of the HTML Cell.
• Dim CurrentDate As Date Now
• tCell1.InnerText Format(CurrentDate, "long
  date")

27
Programming Skills

• To create a new project, but reuse an existing
  Web page, first delete the default Web page from
  the new project by right-clicking the page in the
  Solution Explorer and clicking Delete. Select
  Project Add Existing Item from the menu bar and
  navigate to the wwwroot directory where server
  pages are kept. Find the project that contains
  the existing Web page you want to add to the new
  project, click Open to add the item, then close
  the Add Existing Item dialog box. In the Solution
  Explorer, right-click the newly added Web page
  (it should have an .aspx extension) and click Set
  As Start Page.

28
Note

• The position and spacing of the attributes does
  not effect the interpretation of the HTML code.
  Often, each attribute is listed on a separate
  line. This enhances readability and does not
  effect the execution of the code.

29
The Amortization Table Project
30
Summary

• Web servers are computer hardware and special
  software used to respond to user requests for Web
  pages.
• When a Web page is requested by a user, the Web
  server uses the page's HTML code to build the
  page and then sends the page to the user's
  machine.
• ASP.NET is the platform from which Web
  applications are run. ASP.NET includes the
  controls and objects from which Web pages are
  built, as well as the run-time system needed to
  execute the code on the pages created. ASP.NET is
  part of the .NET framework and thus has access to
  everything available within that framework,
  including ADO.NET, which is used to access
  databases.

31
Summary

• A Web form is a container for controls and other
  graphic elements. It is built from the ASP.NET
  Page class.
• Server controls are controls placed on a Web
  form. When a client calls on the control to
  execute code, the code is executed on the Web
  server.
• Turn an HTML control into a server control by
  including the attribute runat "server" in the
  controls opening tag. To refer to the server
  control in program code, the control's ID
  property must be set.

32
Summary

• The DateAdd(DateInterval, Interval (as Integer),
  Date Variable) function adds an interval to a
  date and returns a date value.