1 / 100

Outline

Explore ASP.NET Web Forms development with simple HTTP transactions, web controls, session tracking, and database connectivity. Learn to create interactive web pages efficiently.

staceyknight
Download Presentation

Outline

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Chapter 20 - ASP .Net, Web Forms and Web Controls Outline 20.1Introduction20.2 Simple HTTP Transaction 20.3 System Architecture 20.4 Creating and Running a Simple Web Form Example 20.5 Web Controls20.5.1  Text and Graphics Controls 20.5.2  AdRotator Control 20.5.3  Validation Controls20.6   Session Tracking 20.6.1  Cookies 20.6.2  Session Tracking with HttpSessionState20.7 Case Study: Online Guest book 20.8 Case Study: Connecting to a Database in ASP .NET 20.9 Tracing

  2. 20.1 Introduction • Web-Based Application Development • Creates Web content for Web browser clients • HyperText Markup Language (HTML) • Client-side scripting • Images and binary data • Web Forms (Web Form pages) • File extension .aspx • ASPX (Web Form files) contain written code, event handlers, utility methods and other supporting code

  3. 20.2 Simple HTTP Transaction • HyperText Transfer Protocol (HTTP) • Defines methods and headers which allows clients and servers exchange information in uniform way • Uniform Resource Locator (URL) • IP address indicating the location of a resource • All HTML documents have a corresponding URL • Domain Name Server (DNS) • A computer that maintains a database of hostnames and their corresponding IP addresses

  4. 20.3 System Architecture • Multi-tier Applications • Web-based applications (n-tier applications) • Tiers are logical groupings of functionality • Information Tier (data tier or bottom tier) • Maintains data pertaining to the applications • Usually stores data in a relational database management systems (RDBMS) • Middle Tier • Acts as an intermediary between data in the information tier and the application's clients

  5. 20.4 Creating and Running a Simple Web-Form Example • Visual Component • Clickable buttons and other GUI components which users interact • Nonvisual Component • Hidden inputs that store any data that document author specifies such as e-mail address

  6. Indicates the figure number, the file name and the purposeof the file Document type declaration Specifies the information needed by Common Language Runtime (CLR) <HTML> and <HEAD> start tags Identifies meta element and content saves meta element’s data Begins HTML body Indicates form executes on a server Label Web Control Output Message 1 <%-- Fig. 20.4: WebTime.aspx --%> 2<%-- A page that contains two labels --%> 3 4 <%@ Page Language="vb" AutoEventWireup="false" 5 Codebehind="WebTime.aspx.vb" Inherits="WebTime.WebTimer"%> 6 7<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 8<HTML> 9 <HEAD> 10 <title>WebTime</title> 11 <meta name="GENERATOR" 12 content="Microsoft Visual Studio.NET 7.0"> 13 <meta name="CODE_LANGUAGE" content="Visual Basic 7.0"> 14 <meta name="vs_defaultClientScript" content="JavaScript"> 15 <meta name="vs_targetSchema" 16 content="http://schemas.microsoft.com/intellisense/ie5"> 17 </HEAD> 18 <body MS_POSITIONING="GridLayout"> 19 <form id="Form1" method="post" runat="server"> 20 21 <asp:Label id="displayLabel" style="Z-INDEX: 101; 22 LEFT: 42px; POSITION: absolute; TOP: 36px" 23 runat="server" Width="186px"> 24A Simple Web Form Example 25 </asp:Label> 26 27 <asp:Label id="timeLabel" style="Z-INDEX: 102; 28 LEFT: 33px; POSITION: absolute; TOP: 84px" 29 runat="server" Width="225px" Height="55px" 30 ForeColor="#C0FFC0" BackColor="Black" 31 Font-Size="XX-Large"> 32 </asp:Label> 33 34 </form> 35 </body> 36 </HTML> WebTime.aspx

  7. Specifies namespaces that contain classes for developing Web-based applications Begins class definition of WebTimer and System.Web.UI.Page Declares references to two Labels Declares initial properties of application components Defines method Page_Init 1 ' Fig. 20.5: WebForm1.aspx.vb 2 ' The code-behind file for a page 3 ' that displays the current time. 4 5 Imports System 6Imports System.Web 7 Imports System.Web.UI 8 Imports System.Web.UI.WebControls 9 10PublicClass WebTimer 11 Inherits System.Web.UI.Page 12 13 ProtectedWithEvents displayLabel As _ 14 System.Web.UI.WebControls.Label 15 16 ProtectedWithEvents timeLabel As _ 17 System.Web.UI.WebControls.Label 18 19 'This call is required by the Web Form Designer. 20PrivateSub InitializeComponent() 21 EndSub 22 23PrivateSub Page_Init(ByVal sender As System.Object, _ 24 ByVal e As System.EventArgs) HandlesMyBase.Init 25 26 InitializeComponent() 27 28 timeLabel.Text = _ 29 String.Format("{0:D2}:{1:D2}:{2:D2}", _ 30 DateTime.Now.Hour, DateTime.Now.Minute, _ 31 DateTime.Now.Second) 32 EndSub' Page_Init WebForm1.aspx

  8. 34 PrivateSub Page_Load(ByVal sender As System.Object, _ 35 ByVal e As System.EventArgs) HandlesMyBase.Load 36 'Put user code to initialize the page here 37 EndSub ' Page_Load 38 EndClass' WebTimer WebForm1.aspx

  9. Defines the body of the document Hidden inputs from the user 1 <!-- Fig. 20.6: WebTime.html --> 2 <!-- The HTML generated when WebTime is loaded. --> 3 4 <!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.0 Transitional//EN"> 5 6 <HTML> 7 <HEAD> 8 <title>WebTime</title> 9 <meta name="GENERATOR" 10 Content="Microsoft Visual Studio 7.0"> 11 <meta name="CODE_LANGUAGE"Content="Visual Basic 7.0"> 12 <meta name="vs_defaultClientScript"content="JavaScript"> 13 <meta name="vs_targetSchema" 14 content="http://schemas.microsoft.com/intellisense/ie5"> 15 </HEAD> 16 17 <body MS_POSITIONING="GridLayout"> 18 <form name="Form1"method="post" 19action="WebTime.aspx"id="Form1"> 20 <input type="hidden"name="__VIEWSTATE" 21 value="dDwtNjA2MTkwMTQ5Ozs+"/> 22 23 <span id="promptLabel" 24 style="font-size:Medium;Z-INDEX: 101; LEFT: 25px; 25 POSITION: absolute; TOP: 23px"> 26 A Simple Web Form Example 27 </span> 28 <span id="timeLabel"style="color:LimeGreen; 29 background-color:Black;font-size:XX-Large; 30 Z-INDEX: 102; LEFT: 25px; POSITION: absolute; 31 TOP: 55px">10:39:35</span> 32 </form> 33 </body> 34 </HTML> WbTime.html

  10. 20.4 Creating and Running a Simple Web –Form Example

  11. 20.4 Creating and Running a Simple Web –Form Example

  12. 20.4 Creating and Running a Simple Web –Form Example

  13. 20.4 Creating and Running a Simple Web –Form Example

  14. 20.4 Creating and Running a Simple Web –Form Example

  15. 20.4 Creating and Running a Simple Web –Form Example

  16. 20.5 Web Controls • Text and Graphics Control • Label, Button, TextBox, ImageRadioButtonList and DropDownList • AdRotator Control • Randomly selects an image to display and then generates a hyperlink to the Web page associated with that image • Validation Controls • Determines whether the data in another Web control are in the proper format • Validates user input

  17. 20.5 Web Controls

  18. Document type declaration Label Web control 1 <%-- Fig. 20.17: Conrols.aspx --%> 2 <%-- Demonstrates web controls --%> 3 4 <%@ Page Language="vb" AutoEventWireup="false" 5 Codebehind="Controls.aspx.vb" 6 Inherits="Controls.WebForm1" 7 enableViewState=“False" EnabledSessionState=“False"%> 8 9<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 10 <HTML> 11 <HEAD> 12 <title>WebForm1</title> 13 <meta name="GENERATOR" 14 content="Microsoft Visual Studio.NET 7.0"> 15 <meta name="CODE_LANGUAGE" content="Visual Basic 7.0"> 16 <meta name="vs_defaultClientScript" content="JavaScript"> 17 <meta name="vs_targetSchema" 18 content="http://schemas.microsoft.com/intellisense/ie5"> 19 </HEAD> 20 <body MS_POSITIONING="GridLayout"> 21 <form id="Form1" method="post" runat="server"> 22 23 <asp:Label id="WelcomeLabel" style="Z-INDEX: 101; 24 LEFT: 44px; POSITION: absolute; TOP: 27px" 25 runat="server" Width="451px" Height="28px" 26 Font-Size="X-Large"> 27 This is a simple registration form. 28 </asp:Label> 29 30 <asp:Label id="RegisterLabel" style="Z-INDEX: 102; 31 LEFT: 48px; POSITION: absolute; TOP: 71px" 32 runat="server" Width="376px" Height="26px" 33 Font-Italic="True" Font-Size="Medium"> 34 Please fill in all fields and click Register. 35 </asp:Label> Controls.aspx

  19. Image control inserts an image into a Web page The ImageUrl property specifies the file location of the image to display TextBox control allows the programmer to read and display text 37 <asp:Image id="UserLabel" style="Z-INDEX: 103; 38 LEFT: 42px; POSITION: absolute; TOP: 135px" 39 runat="server" Width="439px" Height="28px" 40 ImageUrl="images/user.png"> 41 </asp:Image> 42 43 <asp:Label id="FillLabel" style="Z-INDEX: 104; 44 LEFT: 50px; POSITION: absolute; TOP: 189px" 45 runat="server" Width="225px" ForeColor="Lime" 46 Font-Size="Medium"> 47 Please fill out the fields below. 48 </asp:Label> 49 50 <asp:Image id="FirstImage" style="Z-INDEX: 105; 51 LEFT: 49px; POSITION: absolute; TOP: 224px" 52 runat="server" Width="84px" Height="36px" 53 ImageUrl="images/fname.png"> 54 </asp:Image> 55 56 <asp:Image id="EmailImage" style="Z-INDEX: 106; 57 LEFT: 49px; POSITION: absolute; TOP: 280px" 58 runat="server" Width="86px" Height="29px" 59 ImageUrl="images/email.png"> 60 </asp:Image> 61 62 <asp:TextBox id="FirstTextBox" style="Z-INDEX: 107; 63 LEFT: 145px; POSITION: absolute; TOP: 231px" 64 runat="server" Width="115px" Height="20px"> 65 </asp:TextBox> Controls.aspx

  20. 67 <asp:TextBox id="EmailTextBox" style="Z-INDEX: 108; 68 LEFT: 147px; POSITION: absolute; TOP: 284px" 69 runat="server" Width="112px" Height="18px"> 70 </asp:TextBox> 71 71 <asp:Image id="LastImage" style="Z-INDEX: 109; 73 LEFT: 292px; POSITION: absolute; TOP: 227px" 74 runat="server" Width="77px" Height="33px" 75 ImageUrl="images/lname.png"> 76 </asp:Image> 77 78 <asp:Image id="PhoneImage" style="Z-INDEX: 110; 79 LEFT: 292px; POSITION: absolute; TOP: 273px" 80 runat="server" Width="80px" Height="30px" 81 ImageUrl="images/phone.png"> 82 </asp:Image> 83 84 <asp:TextBox id="LastTextBox" style="Z-INDEX: 111; 85 LEFT: 400px; POSITION: absolute; TOP: 232px" 86 runat="server" Width="109px" Height="20px"> 87 </asp:TextBox> 88 89 <asp:TextBox id="PhoneTextBox" style="Z-INDEX: 112; 90 LEFT: 399px; POSITION: absolute; TOP: 277px" 91 runat="server" Width="108px" Height="18px"> 92 </asp:TextBox> 93 94 <asp:Label id="PhoneLabel" style="Z-INDEX: 113; 95 LEFT: 309px; POSITION: absolute; TOP: 318px" 96 runat="server" Width="223px" Height="18px"> 97 Must be in the form (555)555-5555. 98 </asp:Label> Controls.aspx

  21. Defines the ListItems that display when the drop-down list is expanded 100 <asp:Image id="PublicationImage" style="Z-INDEX: 114; 101 LEFT: 50px; POSITION: absolute; TOP: 356px" 102 runat="server" Width="435px" Height="27px" 103 ImageUrl="images/downloads.png"> 104 </asp:Image> 105 106 <asp:Label id="Booklabel" style="Z-INDEX: 115; 107 LEFT: 54px; POSITION: absolute; TOP: 411px" 108 runat="server" Width="348px" Height="23px" 109 ForeColor="Lime" Font-Size="Medium"> 110 Which book would you like information about? 111 </asp:Label> 112 113 <asp:DropDownList id="BookDropDownList" 114 style="Z-INDEX: 116; LEFT: 60px; POSITION: 115 absolute; TOP: 448px" runat="server" 116 Width="326px" Height="29px"> 117 118 <asp:ListItem Value="XML How to Program 1e"> 119 XML How to Program 1e 120 </asp:ListItem> 121 <asp:ListItem Value="C# How to Program 1e"> 122 C# How to Program 1e 123 </asp:ListItem> 124 <asp:ListItem Value="Java How to Program 4e"> 125 Java How to Program 4e 126 </asp:ListItem> 127 <asp:ListItem Value= 128 "Advanced Java How to Program 1e"> 129 Advanced Java How to Program 1e 130 </asp:ListItem> 131 <asp:ListItem Value= 132 "Visual Basic .NET How to Program 2e"> 133 Visual Basic .NET How to Program 2e 134 </asp:ListItem> Controls.aspx

  22. Adds a hyperlink to a Web page RadioButtonList Provides a series of radio buttons from which the user can select only one 135 <asp:ListItem Value="C++ How to Program 3e"> 136 C++ How to Program 3e 137 </asp:ListItem> 138 </asp:DropDownList> 139 140 <asp:HyperLink id="BooksHyperLink" 141 style="Z-INDEX: 117; LEFT: 64px; POSITION: 142 absolute; TOP: 486px" runat="server" 143 Width="385px" Height="22px" 144 NavigateUrl="http://www.deitel.com"> 145 Click here to view more information about our books. 146 </asp:HyperLink> 147 148 <asp:Image id="OperatingImage" style="Z-INDEX: 118; 149 LEFT: 53px; POSITION: absolute; TOP: 543px" 150 runat="server" Width="431px" Height="32px" 151 ImageUrl="images/os.png"> 152 </asp:Image> 153 154 <asp:Label id="OperatingLabel" style="Z-INDEX: 119; 154 LEFT: 63px; POSITION: absolute; TOP: 591px" 156 runat="server" Width="328px" Height="29px" 157 ForeColor="Lime" Font-Size="Medium"> 158 Which operating system are you using? 159 </asp:Label> 160 161 <asp:Button id="RegisterButton" style="Z-INDEX: 124; 162 LEFT: 69px; POSITION: absolute; TOP: 760px" 163 runat="server" Width="120px" Height="33px" 164 Text="Register"> 165 </asp:Button> 166 167 <asp:RadioButtonList id="OperatingRadioButtonList" 168 style="Z-INDEX: 125; LEFT: 65px; POSITION: 169 absolute; TOP: 624px" runat="server" 170 Height="122px" Width="155px"> Controls.aspx

  23. Definition of each radio button 167 <asp:RadioButtonList id="OperatingRadioButtonList" 168 style="Z-INDEX: 125; LEFT: 65px; POSITION: 169 absolute; TOP: 624px" runat="server" 170 Height="122px" Width="155px"> 171 172 <asp:ListItem Value="Windows NT"> 173 Windows NT 174 </asp:ListItem> 175 <asp:ListItem Value="Windows 2000"> 176 Windows 2000 177 </asp:ListItem> 178 <asp:ListItem Value="Windows XP"> 179 Windows XP 180 </asp:ListItem> 181 <asp:ListItem Value="Linux"> 182 Linux 183 </asp:ListItem> 184 <asp:ListItem Value="Other"> 185 Other 186 </asp:ListItem> 187 </asp:RadioButtonList> 188 189 </form> 190 </body> 191 </HTML> Controls.aspx

  24. 20.5 Web Controls

  25. <HTML> and <HEAD> start tags Specifies the information needed by Common Language Runtime (CLR) Identifies meta element and content saves meta element’s data Label Web control 1 <%-- Fig 20.18: CountryRotator.aspx --%> 2 <%-- A Web Form that demonstrates class AdRotator. --%> 3 4 <%@ Page Language="vb" AutoEventWireup="false" 5 Codebehind="CountryRotator.aspx.vb" 6 Inherits="AdRotator.AdRotator"%> 7 8 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 9<HTML> 10 <HEAD> 11 <title>WebForm1</title> 12 <meta content="Microsoft Visual Studio.NET 7.0" 13 name="GENERATOR"> 14 <meta content="Visual Basic 7.0" name="CODE_LANGUAGE"> 15 <meta content="JavaScript" name="vs_defaultClientScript"> 16 <meta name="vs_targetSchema" 17 content="http://schemas.microsoft.com/intellisense/ie5"> 18 </HEAD> 19 <body background= 20 "images/background.png" 21 MS_POSITIONING="GridLayout"> 22 <form id="Form1" method="post" runat="server"> 23 24 <asp:label id="displayLabel" style="Z-INDEX: 101; 25 LEFT: 36px; POSITION: absolute; TOP: 22px" 26 runat="server" Font-Size="Medium" Height="28px" 27 Width="268px">AdRotator Example 28 </asp:label> CountryRotator.aspx

  26. 30 <asp:adrotator id="countryRotator" style="Z-INDEX: 102; 31 LEFT: 36px; POSITION: absolute; TOP: 47px" 32 runat="server" Height="72px" Width="108px" 33 AdvertisementFile="AdRotatorInformation.xml"> 34 </asp:adrotator> 35 36 </form> 37 </body> 38 </HTML> Fig. 20 CountryRotator.aspx

  27. Class AdRotator inherits System.Web.UI.Page Declares reference to one Label Defines method Page_Init 1 ' Fig. 20.19: Country.aspx.vb 2 ' The code-behind file for a page that 3 ' demonstrates the AdRotator class. 4 5 PublicClass AdRotator 6Inherits System.Web.UI.Page 7 8 ProtectedWithEvents displayLabel As _ 9 System.Web.UI.WebControls.Label 10 11 ProtectedWithEvents countryRotator As _ 12 System.Web.UI.WebControls.AdRotator 13 14 ' This call is required by the Web Form Designer. 15 PrivateSub InitializeComponent() 16 EndSub 17 18PrivateSub Page_Init(ByVal sender As System.Object, _ 19 ByVal e As System.EventArgs) HandlesMyBase.Init 20 21 ' CODEGEN: This method call is required by the Web Form Designer 22 ' Do not modify it using the code editor. 23 InitializeComponent() 24 EndSub' Page_Init 25 26 PrivateSub Page_Load(ByVal sender As System.Object, _ 27 ByVal e As System.EventArgs) HandlesMyBase.Load 28 'Put user code to initialize the page here 29 EndSub 30 EndClass' AdRotator Country.aspx

  28. 20.5 Web Controls

  29. Ad elements each provide information about the advertisement AlternateText is a tool tip which displays the message when mouse points over image The higher the Impression value the the more often the advertisement will appear 1 <?xml version="1.0" encoding="utf-8"?> 2 3 <!-- Fig. 20.20: AdRotatorInformation.xml --> 4 <!-- XML file containing advertisement information. --> 5 6 <Advertisements> 7 <Ad> 8 <ImageUrl>images/us.png</ImageUrl> 9 <NavigateUrl> 10 http://www.odci.gov/cia/publications/factbook/geos/us.html 11 </NavigateUrl> 12 <AlternateText>United States Information</AlternateText> 13 <Impressions>1</Impressions> 14 </Ad> 15 16 <Ad> 17 <ImageUrl>images/france.png</ImageUrl> 18 <NavigateUrl> 19 http://www.odci.gov/cia/publications/factbook/geos/fr.html 20 </NavigateUrl> 21 <AlternateText>France Information</AlternateText> 22 <Impressions>1</Impressions> 23 </Ad> 24 25 <Ad> 26 <ImageUrl>images/germany.png</ImageUrl> 27 <NavigateUrl> 28 http://www.odci.gov/cia/publications/factbook/geos/gm.html 29 </NavigateUrl> 30 <AlternateText>Germany Information</AlternateText> 31 <Impressions>1</Impressions> 32 </Ad> AdRotatorInformation.xml

  30. ImageUrl specifies the location of the advertisement image NavigateUrl indicates URL for the web page that loads when a userclicks the advertisement 34 <Ad> 35 <ImageUrl>images/italy.png</ImageUrl> 36 <NavigateUrl> 37 http://www.odci.gov/cia/publications/factbook/geos/it.html 38 </NavigateUrl> 39 <AlternateText>Italy Information</AlternateText> 40 <Impressions>1</Impressions> 41 </Ad> 42 43 <Ad> 44 <ImageUrl>images/spain.png</ImageUrl> 45 <NavigateUrl> 46 http://www.odci.gov/cia/publications/factbook/geos/sp.html 47 </NavigateUrl> 48 <AlternateText>Spain Information</AlternateText> 49 <Impressions>1</Impressions> 50 </Ad> 51 52 <Ad> 53 <ImageUrl>images/latvia.png</ImageUrl> 54 <NavigateUrl> 55 http://www.odci.gov/cia/publications/factbook/geos/lg.html 56 </NavigateUrl> 57 <AlternateText>Latvia Information</AlternateText> 58 <Impressions>1</Impressions> 59 </Ad> 60 61 <Ad> 62 <ImageUrl>images/peru.png</ImageUrl> 63 <NavigateUrl> 64 http://www.odci.gov/cia/publications/factbook/geos/pe.html 65 </NavigateUrl> 66 <AlternateText>Peru Information</AlternateText> 67 <Impressions>1</Impressions> 68 </Ad> AdRotatorInformation.xml

  31. ImageUrl specifies the location of the advertisement image NavigateUrl indicates URL for the web page that loads when a userclicks the advertisement 70 <Ad> 71 <ImageUrl>images/senegal.png</ImageUrl> 72 <NavigateUrl> 73 http://www.odci.gov/cia/publications/factbook/geos/sg.html 74 </NavigateUrl> 75 <AlternateText>Senegal Information</AlternateText> 76 <Impressions>1</Impressions> 77 </Ad> 78 79 <Ad> 80 <ImageUrl>images/sweden.png</ImageUrl> 81 <NavigateUrl> 82 http://www.odci.gov/cia/publications/factbook/geos/sw.html 83 </NavigateUrl> 84 <AlternateText>Sweden Information</AlternateText> 85 <Impressions>1</Impressions> 86 </Ad> 87 88 <Ad> 89 <ImageUrl>images/thailand.png</ImageUrl> 90 <NavigateUrl> 91 http://www.odci.gov/cia/publications/factbook/geos/th.html 92 </NavigateUrl> 93 <AlternateText>Thailand Information</AlternateText> 94 <Impressions>1</Impressions> 95 </Ad> 96 97 <Ad> 98 <ImageUrl>images/unitedstates.png</ImageUrl> 99 <NavigateUrl> 100 http://www.odci.gov/cia/publications/factbook/geos/us.html 101 </NavigateUrl> 102 <AlternateText>United States Information</AlternateText> 103 <Impressions>1</Impressions> 104 </Ad> 105 </Advertisements> AdRotatorInformation.xml

  32. <HTML> and <HEAD> start tags Displays the words generated from the phone number if validator is successful 1 <%-- Fig. 20.21: Generator.aspx --%> 2 <%-- A Web Form demonstrating the use of validators. --%> 3 4 <%@ Page Language="vb" AutoEventWireup="false" 5 Codebehind="Generator.aspx.vb" 6 Inherits="WordGenerator.Generator"7 enableViewState=“False" EnableSessionState=“False" %>8 9 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 10<HTML> 11 <HEAD> 12 <title>WebForm1</title> 13 <meta name="GENERATOR" 14 content="Microsoft Visual Studio.NET 7.0"> 15 <meta name="CODE_LANGUAGE" content="Visual Basic 7.0"> 16 <meta name="vs_defaultClientScript" content="JavaScript"> 17 <meta name="vs_targetSchema" 18 content="http://schemas.microsoft.com/intellisense/ie5"> 19 </HEAD> 20 <body MS_POSITIONING="GridLayout"> 21 <form id="Form1" method="post" runat="server"> 22 23 <asp:Label id="promptLabel" style="Z-INDEX: 101; 24 LEFT: 32px; POSITION: absolute; TOP: 17px" 25 runat="server"> 26 Please enter a phone number in the form 555-4567. 27 </asp:Label> 28 29 <asp:TextBox id="outputTextBox" style="Z-INDEX: 106; 30 LEFT: 40px; POSITION: absolute; TOP: 118px" 31 runat="server" Width="451px" Height="342px" 32 TextMode="MultiLine" Visible="False"> 33 </asp:TextBox> Generator.aspx

  33. The regular expression is assignedto ValidationExpression ErrorMessage is displayed on the web form if validation fails Confirms that phoneTextBox’s content is not empty 35 <asp:RegularExpressionValidator id="phoneNumberValidator" 36 style="Z-INDEX: 105; LEFT: 204px; POSITION: absolute; 37 TOP: 44px" runat="server" ErrorMessage= 38 "The phone number must be in the form 555-4567." 39 ControlToValidate="phoneTextBox" 40 ValidationExpression="^\d{3}-\d{4}$"> 41 </asp:RegularExpressionValidator> 42 43 <asp:RequiredFieldValidator id="phoneInputValidator" 44 style="Z-INDEX: 104; LEFT: 207px; POSITION: 45 absolute; TOP: 81px" runat="server" 46 ErrorMessage= 47 "Please enter a phone number." 48 ControlToValidate="phoneTextBox"> 49 </asp:RequiredFieldValidator> 50 51 <asp:Button id="submitButton" style="Z-INDEX: 103; 52 LEFT: 38px; POSITION: absolute; TOP: 77px" 53 runat="server" Text="Submit"> 54 </asp:Button> 55 56 <asp:TextBox id="phoneTextBox" style="Z-INDEX: 102; 57 LEFT: 34px; POSITION: absolute; TOP: 42px" 58 runat="server"> 59 </asp:TextBox> 60 61 </form> 62 </body> 63 </HTML> Generator.aspx

  34. Determines whether the page is being loaded due to a postback Text property is set to empty string Retrieves the number and removes the hyphen 1 ' Fig. 20.22: Generator.aspx.vb 2 ' The code-behind file for a page that 3 ' generates words when given a phone number. 4 5 Imports System.Web.UI.WebControls 6 7 PublicClass Generator 8 Inherits System.Web.UI.Page 9 10 Protected WithEvents phoneInputValidator As _ 11 RequiredFieldValidator 12 13 ProtectedWithEvents phoneNumberValidator As _ 14 RegularExpressionValidator 15 16 ProtectedWithEvents promptLabel As Label 17 ProtectedWithEvents outputTextBox As TextBox 18 ProtectedWithEvents submitButton As Button 19 ProtectedWithEvents phoneTextBox As TextBox 20 21 ' Web Form Designer generated code 22 23 PrivateSub Page_Load(ByVal sender As System.Object, _ 24 ByVal e As System.EventArgs) HandlesMyBase.Load 25 26 ' if not first time page loads 27If IsPostBack Then 28 Dim number As String 29 30 outputTextBox.Text() = "" 31 32 ' retrieve number and remove "-" 33 number = Request.Form("phoneTextBox") 34 number = number.Remove(3, 1) Generator.aspx.vb

  35. Initializes the outputTextBox’s visible property to True Recursive method that generates list of words from the String containing digits 36 ' generate words for first 3 digits 37 outputTextBox.Text &= "Here are the words for the" & _ 38 "first three digits" & vbCrLf 39 40 ComputeWords(number.Substring(0, 3), "") 41 outputTextBox.Text &= vbCrLf 42 43 ' generate words for last 4 digits 44 outputTextBox.Text &= "Here are the words for the" & _ 45 "last 4 digits" & vbCrLf 46 47 ComputeWords(number.Substring(3), "") 48 49 outputTextBox.Visible = True 50 End If 51 52 End Sub' Page_Load 53 54 Private Sub ComputeWords(ByVal number AsString, _ 55ByVal temporaryWord AsString) 56 57 Dim current AsInteger 58 59 ' if number is empty, print word 60 If number = ""Then 61 outputTextBox.Text &= temporaryWord & vbCrLf 62 Return 63 EndIf 64 65 ' retrieve first number and convert to Integer 66 current = Convert.ToInt32(number.Substring(0, 1)) 67 68 ' delete first number 69 number = number.Remove(0, 1) Generator.aspx.vb

  36. 71 ' determine number, call ComputeWord recursively 72 SelectCase current 73 74 ' 0 can be q or z 75 Case0 76 ComputeWords(number, temporaryWord & "q") 77 ComputeWords(number, temporaryWord & "z") 78 79 ' 1 has no letter associated with it 80 Case1 81 ComputeWords(number, temporaryWord & "") 82 83 ' 2 can be a, b or c 84 Case2 85 ComputeWords(number, temporaryWord & "a") 86 ComputeWords(number, temporaryWord & "b") 87 ComputeWords(number, temporaryWord & "c") 88 89 ' 3 can be d, e or f 90 Case3 91 ComputeWords(number, temporaryWord & "d") 92 ComputeWords(number, temporaryWord & "e") 93 ComputeWords(number, temporaryWord & "f") 94 95 ' 4 can be g, h or i 96 Case4 97 ComputeWords(number, temporaryWord & "g") 98 ComputeWords(number, temporaryWord & "h") 99 ComputeWords(number, temporaryWord & "i") Generator.aspx.vb

  37. 101 ' 5 can be j, k or l 102 Case5 103 ComputeWords(number, temporaryWord & "j") 104 ComputeWords(number, temporaryWord & "k") 105 ComputeWords(number, temporaryWord & "l") 106 107 ' 6 can be m, n or o 108 Case6 109 ComputeWords(number, temporaryWord & "m") 110 ComputeWords(number, temporaryWord & "n") 111 ComputeWords(number, temporaryWord & "o") 112 113 ' 7 can be p, r or s 114 Case7 115 ComputeWords(number, temporaryWord & "p") 116 ComputeWords(number, temporaryWord & "r") 117 ComputeWords(number, temporaryWord & "s") 118 119 ' 8 can be t, u or v 120 Case8 121 ComputeWords(number, temporaryWord & "t") 122 ComputeWords(number, temporaryWord & "u") 123 ComputeWords(number, temporaryWord & "v") 124 125 ' 9 can be w, x or y 126 Case9 127 ComputeWords(number, temporaryWord & "w") 128 ComputeWords(number, temporaryWord & "x") 129 ComputeWords(number, temporaryWord & "y") 130 EndSelect 131 132 EndSub' ComputeWords 133 EndClass' Generator Generator.aspx.vb

  38. 20.5 Web Controls

  39. 20.5 Web Controls

  40. ECMAScript provides implementation for validation controls 1 <!-- Fig. 20.23: Generator.html --> 2 <!-- The HTML page that is sent to the client browser. --> 3 4 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > 5 <HTML> 6 <HEAD> 7 <title>WebForm1</title> 8 <meta name="GENERATOR" 9 content="Microsoft Visual Studio 7.0"> 10 <meta name="CODE_LANGUAGE" content="Visual Basic 7.0" > 11 <meta name="vs_defaultClientScript" 12 content="JavaScript"> 13 <meta name="vs_targetSchema" 14 content="http://schemas.microsoft.com/intellisense/ie5"> 15 </HEAD> 16 17 <body MS_POSITIONING="GridLayout"> 18 19 <form name="Form1" method="post" 20 action="Generator.aspx" language="javascript" 21 onsubmit="ValidatorOnSubmit();" id="FORM1"> 22 <input type="hidden" name="__VIEWSTATE" 23 value="dDwxMjgyMzM3ozs+" /> 24 25 <script language="javascript" 26 src= 27 "/aspnet_client/system_web/1_0_3215_11/WebUIValidation.js"> 28 </script> Generator.html

  41. 30 <span id="phoneNumberValidator" 31 controltovalidate="phoneTextBox" 32 errormessage= 33 "The phone number must be in the form 555-4567." 34 evaluationfunction= 35 "RegularExpressionValidatorEvaluateIsValid" 36 validationexpression="^\d{3}-\d{4}$" 37 style="color:Red;Z-INDEX:106;LEFT:217px; 38 POSITION:absolute;TOP:73px;visibility:hidden;"> 39 The phone number must be in the form 555-4567. 40 </span> 41 42 <input name="phoneTextBox" type="text" 43 id="phoneTextBox" 44 style="Z-INDEX: 102; LEFT: 16px; 45 POSITION: absolute; TOP: 52px" /> 46 47 <input type="submit" name="submitButton" 48 value="Submit" 49 onclick= "if ( " + 50 "typeof(Page_ClientValidate) == 'function') " + 51 "Page_ClientValidate(); " language="javascript" 52 id="submitButton" style="Z-INDEX: 103; 53 LEFT: 16px; 54 POSITION: absolute; 55 TOP: 86px" /> Generator.html

  42. ECMAScript provides implementation for validation controls 57 <span id="phoneInputValidator" 58 controltovalidate="phoneTextBox" 59 errormessage="Please enter a phone number." 60 evaluationfunction= 61 "RequiredFieldValidatorEvaluateIsValid" 62 initialvalue="" style="color:Red;Z-INDEX:105; 63 LEFT:217px;POSITION:absolute;TOP:47px; 64 visibility:hidden;">Please enter a phone number. 65 </span> 66 67 <span id="promptLabel" style="Z-INDEX: 101; 68 LEFT: 16px; POSITION: absolute; TOP: 23px"> 69 Please enter a phone number in the form 555-4567: 70 </span> 71 72 <script language="javascript"> 73 <!-- 74 var Page_Validators = new Array( 75 document.all["phoneNumberValidator"], 76 document.all["phoneInputValidator"] ); 77 // --> 78 </script> 79 80 <script language="javascript"> 81 <!-- 82 var Page_ValidationActive = false; 83 84 if ( 85 typeof(clientInformation) != "undefined" && 86 clientInformation.appName.indexOf("Explorer") 87 != -1 ) { Generator.html

  43. 89 if ( typeof(Page_ValidationVer) == "undefined" ) 90 alert( 91 "Unable to find script library " + 92 "'/aspnet_client/system_web/'"+ 93 "'1_0_3215_11/WebUIValidation.js'. " + 94 "Try placing this file manually, or " + 95 "reinstall by running 'aspnet_regiis -c'."); 96 else if ( Page_ValidationVer != "125" ) 97 alert( 98 "This page uses an incorrect version " + 99 "of WebUIValidation.js. The page " + 100 "expects version 125. " + 101 "The script library is " + 102 Page_ValidationVer + "."); 103 else 104 ValidatorOnLoad(); 105 } 106 107 function ValidatorOnSubmit() { 108 if (Page_ValidationActive) { 109 ValidatorCommonOnSubmit(); 110 } 111 } 112 // --> 113 </script> 114 </form> 115 </body> 116 </HTML> Generator.html

  44. 20.6 Session Tracking • Cookies • Text file stored by a Web site on a individual’s computer that allows the site to track the actions of the visitor • Records sites that the user visits and identifies shopping preferences • Cookies can store name-value pairs • Web Server can never access cookies created outside the domain associated with that server • HttpSessionState • HttpSessionState objects can store any type of objects (not just Strings) as attribute values

  45. Label Web control 1 <%-- Fig 20.24: OptionsPage.aspx --%> 2 <%-- allows clients to select a programming language --%> 3 <%-- to get recommendations --%> 4 5 <%@ Page Language="vb" AutoEventWireup="false" 6 Codebehind="OptionsPage.aspx.vb" 7 Inherits="Cookies.Cookie"%> 8 9 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 10 <HTML> 11 <HEAD> 12 <title>Cookies</title> 13 <meta content="Microsoft Visual Studio.NET 7.0" 14 name="GENERATOR"> 15 <meta content="Visual Basic 7.0" name="CODE_LANGUAGE"> 16 <meta content="JavaScript" name="vs_defaultClientScript"> 17 <meta name="vs_targetSchema" 18 content="http://schemas.microsoft.com/intellisense/ie5"> 19 </HEAD> 20 <body MS_POSITIONING="GridLayout"> 21 <form id="Form1" method="post" runat="server"> 22 23 <asp:label id="promptLabel" style="Z-INDEX: 101; 24 LEFT: 42px; POSITION: absolute; TOP: 22px" 25 runat="server" Font-Bold="True"Font-Size="Large"> 26 Select a programming language. 27 </asp:label> 28 29 <asp:radiobuttonlist id="LanguageList" 30 style="Z-INDEX: 111; LEFT: 42px; POSITION: 31 absolute; TOP: 52px" runat="server"> 32 33 <asp:ListItem Value="Visual Basic .NET" 34 Selected="True">Visual Basic .NET</asp:ListItem> OptionsPage.aspx

  46. Defines five radio buttons Recommendation hyperlink displayed Language hyperlink displayed Forwards the user to OptionsPage.aspxto display list of languages 36 <asp:ListItem Value="C#">C#</asp:ListItem> 37 <asp:ListItem Value="C">C</asp:ListItem> 38 <asp:ListItem Value="C++">C++</asp:ListItem> 39 <asp:ListItem Value="Python">Python</asp:ListItem> 40 </asp:radiobuttonlist> 41 42 <asp:hyperlink id="recommendationsLink" 43 style="Z-INDEX: 110; LEFT: 42px; POSITION: 44 absolute; TOP: 90px" runat="server" 45 Visible="False" NavigateUrl= 46 "RecommendationPage.aspx"> 47 Click here to get book recommendations 48 </asp:hyperlink> 49 50 <asp:hyperlink id="languageLink" style="Z-INDEX: 51 109; LEFT: 42px; POSITION: absolute; 52 TOP: 55px" runat="server" Visible="False" 53 NavigateUrl="OptionsPage.aspx"> 54 Click here to choose another language 55 </asp:hyperlink> 56 57 <asp:label id="welcomeLabel" style="Z-INDEX: 108; 58 LEFT: 42px; POSITION: absolute; TOP: 23px" 59 runat="server" Visible="False" Font-Bold="True" 60 Font-Size="Large">Welcome to cookies! You selected 61 </asp:label> 62 63 <asp:button id="submitButton" style="Z-INDEX: 107; 64 LEFT: 42px; POSITION: absolute; TOP: 196px" 65 runat="server" Text="Submit"> 66 </asp:button> 67 68 </form> 69 </body> 70 </HTML> OptionsPage.aspx

  47. Imports System.Web.UI.WebControls Defines books as a Hashtable ISBN numbers for the recommended books 1 ' Fig. 20.25: OptionsPage.aspx.vb 2 ' Page that allows the user to choose a different language 3 4Imports System.Web.UI.WebControls 5 6 PublicClass Cookie 7 Inherits System.Web.UI.Page 8 ProtectedWithEvents languageLink As HyperLink 9 ProtectedWithEvents recommendationsLink As HyperLink 10 ProtectedWithEvents promptLabel As Label 11 ProtectedWithEvents LanguageList As RadioButtonList 12 ProtectedWithEvents welcomeLabel As Label 13 ProtectedWithEvents submitButton As Button 14Private books = New Hashtable() 15 16 ' Visual Studio .NET generated code 17 18 PrivateSub Page_Init(ByVal sender As System.Object, _ 19 ByVal e As System.EventArgs) HandlesMyBase.Init 20 21 InitializeComponent() 22 23 ' add values to Hastable 24 books.Add("Visual Basic .NET", "0-13-456955-5") 25 books.Add("C#", "0-13-062221-4") 26 books.Add("C", "0-13-089572-5") 27 books.Add("C++", "0-13-089571-7") 28 books.Add("Python", "0-13-092361-3") 29 EndSub' Page_Init OptionsPage.aspx

  48. Determines if the user selected a language Displays language in welcomelabel By clicking submit creates a cookie 31 PrivateSub Page_Load(ByVal sender As System.Object, _ 32 ByVal e As System.EventArgs) HandlesMyBase.Load 33 34 If IsPostBack Then 35 36 ' if postback is True, user has submitted information 37 ' display welcome message and appropriate hyperlinks 38 welcomeLabel.Visible = True 39 languageLink.Visible = True 40 recommendationsLink.Visible = True 41 42 ' hide option information 43 submitButton.Visible = False 44 promptLabel.Visible = False 45 LanguageList.Visible = False 46 47If (LanguageList.SelectedItem IsNothing) = FalseThen 48 welcomeLabel.Text &= " " & _ 49 LanguageList.SelectedItem.Text.ToString & "." 50 Else 51 welcomeLabel.Text &= "no language." 52 EndIf 53 EndIf 54 EndSub' Page_Load 55 56PrivateSub submitButton_Click(ByVal sender As System.Object, _ 57 ByVal e As System.EventArgs) Handles submitButton.Click 58 59 Dim language, ISBN AsString 60 Dim cookie As HttpCookie OptionsPage.aspx

  49. Adds the cookie to the Cookies collection Stores the language and its corresponding ISBN number in cookie 62 ' if choice was made by user 63 If (LanguageList.SelectedItem IsNothing) = FalseThen 64 language = LanguageList.SelectedItem.ToString() 65 ISBN = books(language).ToString() 66 67 ' create cookie, name/value pair is 68 ' language chosen and ISBN number from Hashtable 69 cookie = New HttpCookie(language, ISBN) 70 71 ' add cookie to response, 72 ' thus placing it on user's machine 73 Response.Cookies.Add(cookie) 74 EndIf 75 76 End Sub ' submitButton_Click 77 EndClass' Cookie OptionsPage.aspx

  50. 20.6 Session Tracking

More Related