1. Chapter 9 Programming with Web Forms
Programming In
Visual Basic .NET

2. Web Forms Thus far, projects have been based on Windows Forms
Use Web Forms when programming for the Internet
Web Forms display as a document in a browser
Use Mobile Web Forms to display documents on mobile devices such as cell phones and PDAs
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

3. Client/Server Web Applications
Require a server and a client
Server sends the Web Pages to the Client
Client displays the Web Pages in Browser
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

4. Web Servers Remote Web Server OR
Local machine set up as a Web Server by installing IIS before installing VB
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

5. Web Clients
Browsers display pages written in hypertext markup language (HTML)
Microsoft Internet Explorer
Netscape
Pages may also contain program logic in the form of
Java Applets
Script
JavaScript
VBScript
JScript
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

6. Web Pages Stateless Techniques for working around Stateless
Does not store any information about its contents from one invocation to the next
Techniques for working around Stateless
Cookies stored on local machine
Sending state information to server as part of the page's address, uniform resource locator (URL)
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

7. Visual Basic and ASP.NET
ASP.NET is the latest Web programming technology from Microsoft
When using Web Forms in VB .NET you are using ASP.NET
Each Web Form has two distinct pieces
HTML, .aspx
VB code, .aspx.vb
Visual Studio IDE automatically generates the HTML
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

8. Folder on your machine set up by IIS
Creating Web Forms
New Project dialog box, select ASP.NET Web Application
Folder on your machine set up by IIS
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

9. Creating Web Forms (continued)
Name box is disabled
Name project by modifying the location to include the ProjectName in place of WebApplication1
The ProjectName will become a new folder located in the Inetpub\wwwroot folder on the local machine
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

10. Web Forms in the Visual Studio IDE
As Web project opens, connection to Web Server is established
Web forms are based on a completely different class
Web forms have different
Controls
Properties, Methods, and Events
Toolbar, Toolbox and lists of files in Solution Explorer
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

11. Web Forms - Specific Differences
Web controls have an ID property rather than a Name property
A Web form inherits from System.Web.UI.Page
A button control for web forms inherits from System.Web.UI.WebControls.Button
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

12. Visual Studio IDE - Web Form
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

13. Viewing the HTML Code
Tabs at bottom of the form in the Designer allow you to switch between the HTML code and VB code
Do not worry about reading HTML since it is automatically generated
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

14. Toolbars Display while you are creating the user interface
Display Borders
Show Details
Lock Elements
Show Grid
Snap to Grid
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

15. Controls HTML Controls HTML Server controls
Standard HTML client side elements
HTML Server controls
All the attributes of HTML (client) Controls
Added capability of object-oriented, event-driven, server-side programming
Web Server Controls (ASP.NET Controls)
Most powerful controls
Rendered differently for different browsers
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

16. Controls (continued) Toolbox includes tabs for selecting control type
HTML
Web Forms
Components for Web Server controls
VS Designer adds a small green arrow in the upper-left corner of server controls
Server Control
Client-side HTML Control
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

17. Event Handling
Events are written in the same way as for Windows controls
Events may actually occur on
Client
Server
Events are somewhat different than for Windows Forms
Example: Page_Load versus Form_Load
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

18. Files (see Table 9.1, page 359) .aspx file
Holds specifications for the user interface
.aspx.vb (“code-behind” file)
VB code written to respond to events
Styles.css
Cascading Style Sheet for positioning and formatting text and elements on a Web Page
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

19. Files (continued) Web.config .dll
Configuration info about each URL resource
.dll
Generated by compiler
Contains compiled code
When a request for the Web page is made by accessing the URL of the Web page, the .dll file produces the HTML output for the page
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

20. Testing In Other Browsers
By default, Web projects are tested in Microsoft Internet Explorer
To test in another browser
Launch the browser, Netscape
Type the URL of the page into the Address Bar
Example:
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

21. Laying Out Web Forms Factors that will effect the layout of page
Browsers
Screen Sizes
Screen Resolutions
Window Sizes
Methods for better control of layout
Page Layout Property
HTML Tables
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

22. The Page Layout
The PageLayout property determines how and where the controls on a Web page appear
Choices
Flow Layout
Similar to adding text in a word processor
When user resizes window in browser, controls move to fit window
Grid Layout (default)
Determine exact placement based on an X and Y grid
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

23. Using Tables for Layout
HTML Tables contain rows and columns
Add controls and text to the table cells to align the columns
Most useful in a flow layout
Table is an HTML control, requiring no server-side programming
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

24. Using Tables for Layout (continued)
Add Table control from Toolbox OR
Table menu / Insert / Table
Dialog box allows specification for
Number of Rows and Columns, Borders, Alignment, Background Color
Move Table
Select table and drag (Grid), Insert spaces (Flow)
Add/Delete Row or Column
Right-click, use context menu
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

25. Using the Validator Controls
Client-side controls that automatically validate input data
Steps for using
Add a validator control
Attach it to an input control, such as a text box
Set the error message to be used for invalid data
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

26. Validator Controls (continued)
RequiredFieldValidator
CompareValidator
RangeValidator
RegularExpressionValidator
ValidationSummary
See Table 9.2, page 365
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

27. Maintaining State
Must take steps to maintain values of variables and controls on page
Set EnableViewState to True (default) so control contents reappear for each postback
Store value of module-level variables in controls to hold their values during postback
See Advanced VB .NET text to learn about using cookies to maintain state
Use IsPostBack property to control actions on postback
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

28. Navigating Web Pages
Add a HyperLink to allow user to navigate to another site or page
Enter a Text property for the text to display for the user
Enter a NavigateUrl property to specify the URL to navigate to
Specify “Document Relative” or “Root Relative”
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

29. Managing Web Projects Successfully moving Web Projects is a challenge
Solution files (.sln and .suo) are saved in a separate folder in a different location from the rest of the project
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

30. Location of Files
Visual Studio IDE saves solution files, .sln and .suo, in the default folder that you select in Tools/Options/Environment
All other files (EXCEPT the solution files) are stored in a new folder created beneath Inetpub/wwwroot
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

31. Location of Files (continued)
If you move your project to a different machine you must remember to move both project folders
Recommendation:
As soon as you create a new Web Project, select the solution file in Solution Explorer, File menu, Save As, save in project folder under Inetpub/wwwroot
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

32. Moving a Project
Copy the project folder from Inetpub/wwwroot on the source computer to same location on the target machine
Then
Create a Virtual Directory (virtual folder) OR
Web Share the Project Folder
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

33. Creating a Virtual Directory
Right-click on My Computer, select Manage, double-click on Services and Applications
Internet Information Services is last item, click on Web Sites, then Default Web Site
Select project folder, right-click, display Properties and on Directory tab under Application Settings, click Create button, click OK
Open project in VS IDE, select startup page in Solution Explorer, right-click, choose Set as start page
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

34. Web Sharing the Project Folder
Select the Project folder in My Computer
Right-click, select Properties, Web Sharing, activate Share This Folder
In Edit Alias dialog click OK
Note: This is not the preferred method since it may create security problems on the network!
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

35. Renaming a Web Project
Must take one more step after renaming a Web project
Open the .sln file in an editor (such as Notepad)
Carefully edit folder and project name to new project name
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

36. Deleting a Web Project Project in IIS Virtual Directory
Delete the directory
Project in Web Shared Folder
Unshare it from Properties dialog
Either Reboot Computer or Stop and Restart IIS
Delete Folder
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.

37. Some Web Acronyms XML – Extensible Markup Language
SOAP – Simple Object Access Protocol
HTTP – HyperText Transfer Protocol
Web Service – Code in classes, provides middle-tier services over Internet
WSDL – Web Service Description Language
© 2005 by The McGraw-Hill Companies, Inc. All rights reserved.