Visual Basic.NET Comprehensive Concepts and Techniques Chapter 11 Creating Web Applications and Writing Data to a Database

Chapter 11: Creating Web Applications and Writing Data to a Database 2 Objectives Declare a public procedure in a module Use optional parameters in a procedure Use SQL SELECT statements to read individual records from a database Use SQL UPDATE statements to update individual records in a database Start a new ASP.NET Web application Understand Web applications and Web forms

Chapter 11: Creating Web Applications and Writing Data to a Database 3 Objectives Explain when to use HTML controls and Web controls in a Web application Use Table and Horizontal Rule HTML controls on a Web form View HTML code for a Web form Use Label, TextBox, and Button Web controls on a Web form Test a Web application Understand how ASP.NET, the CLR, and Microsoft Internet Information Services interact to run a Web application

Chapter 11: Creating Web Applications and Writing Data to a Database 4 Creating the Compensation Review Update Web Application

Chapter 11: Creating Web Applications and Writing Data to a Database 5 Creating the Compensation Review Update Web Application

Chapter 11: Creating Web Applications and Writing Data to a Database 6 Creating the Compensation Review Update Web Application

Chapter 11: Creating Web Applications and Writing Data to a Database 7 Starting Visual Basic.NET and Adding a New Module to a Project Insert the Data Disk in drive A. Using Windows Explorer, if necessary copy the Compensation Review folder and Compensation Review.mdb database file from the A:\Chapter10 folder to the A:\Chapter11 folder Start Visual Basic.NET. When the Start Page appears, click the Open Project button on the Start Page If necessary, click the Look in box arrow and then click 3½ Floppy (A:). Double-click the Chapter11 folder Double-click the Compensation Review folder. If necessary, click the Compensation Review solution file (Compensation Review.sln)

Chapter 11: Creating Web Applications and Writing Data to a Database 8 Starting Visual Basic.NET and Adding a New Module to a Project Click the Open button. When the Compensation Review project appears in the Solution Explorer window, right-click the Compensation Review project. When the shortcut menu appears, point to the Add command and then click Add New Item on the Add menu Click the Module template in the Templates area. Select the text in the Name box and type UpdateCompensation.vb as the new name. Click the Open button

Chapter 11: Creating Web Applications and Writing Data to a Database 9 Declaring a Public Procedure in a Module and Opening a Database Connection When the UpdateCompensation.vb code window opens, type lines 1 and 2, add the word Public to line 3, and enter the remaining code as shown below:

Chapter 11: Creating Web Applications and Writing Data to a Database 10 Coding an SQL UPDATE Statement to Update Employee Records Type lines 17 through 23, as shown below:

Chapter 11: Creating Web Applications and Writing Data to a Database 11 Executing an SQL UPDATE Statement Type lines 24 and 25, as shown below:

Chapter 11: Creating Web Applications and Writing Data to a Database 12 Using the SQL Insert and Delete Statements

Chapter 11: Creating Web Applications and Writing Data to a Database 13 Adding an Optional Parameter to a Procedure Double-click the Employees.vb module in the Solution Explorer window Modify lines 10 and 12 as shown below to change the folder name for the Data Source of the new connection string and to add an optional parameter to the New() constructor declaration

Chapter 11: Creating Web Applications and Writing Data to a Database 14 Coding an SQL SELECT Statement to Read an Individual Record from a Table With the Employees.vb module open in the main work area, remove the string concatenation character (&) and line continuation character (_) from line 29 of the Employees class constructor as shown on the following slide Type lines 30 through 32 and line 35 as shown on the following slide. Lines 33 and 34 are already coded and should be included in the Else clause of the If statement

Chapter 11: Creating Web Applications and Writing Data to a Database 15 Coding an SQL SELECT Statement to Read an Individual Record from a Table

Chapter 11: Creating Web Applications and Writing Data to a Database 16 Building, Saving, and Documenting the Class Library Right-click the Compensation Review project in the Solution Explorer window. When the shortcut menu appears, click the Build command Use the Print command on the File menu to print a record of the code for the Employees class Click the UpdateCompensation.vb tab in the main work area. Use the Print command on the File menu to print a record of the code for the UpdateCompensation.vb module

Chapter 11: Creating Web Applications and Writing Data to a Database 17 Creating a Web Application

Chapter 11: Creating Web Applications and Writing Data to a Database 18 Starting a New ASP.NET Web Application Project Right-click the Compensation Review solution in the Solution Explorer window. When the shortcut menu appears, click the Add command. When the Add shortcut menu appears, click the Add New Project command When the Add New Project dialog box appears, click the ASP.NET Web Application icon in the Templates area Select the text, WebApplication1, in the Location text box. Type CompensationReviewUpdate in the Location box Click the OK button

Chapter 11: Creating Web Applications and Writing Data to a Database 19 Starting a New ASP.NET Web Application Project After Visual Basic.NET creates the Web application and opens the Web application in the IDE, if necessary, pin the Toolbox in the IDE Right-click the WebForm1.aspx Web form in the Solution Explorer window. When the shortcut menu appears, click the Rename command. Type CompensationReviewUpdate.aspx as the new Web form name Right-click the References folder and use the Add Reference command to add a reference to the Compensation Review.dll file

Chapter 11: Creating Web Applications and Writing Data to a Database 20 Web Form Properties

Chapter 11: Creating Web Applications and Writing Data to a Database 21 Changing Web Form Properties Click anywhere on the grid in the main work area to select the CompensationReviewUpdate Web form. Click the bgColor property value in the Properties list When the Color Picker dialog box appears, click the System Colors tab. Click the ActiveBorder color in the Color list box Click the OK button If necessary, scroll to the title property in the Properties list. Type Compensation Review Update as the new value of the title property

Chapter 11: Creating Web Applications and Writing Data to a Database 22 Adding and Formatting a Table HTML Control If necessary, click the HTML tab in the Toolbox window. Drag a Table control from the Toolbox window to the Web form as shown below:

Chapter 11: Creating Web Applications and Writing Data to a Database 23 Adding and Formatting a Table HTML Control Click directly above the first column of the table Click the Table command on the main menu. When the Table menu appears, click the Delete command. When the Delete submenu appears, click the Columns command Click directly to the left of the second row of the table. Press CTRL+ALT+DOWN ARROW ten times to add ten rows to the table With the second row of the table still selected, click the Merge Cells command on the Table menu. Select the first row of the table and then click the Merge Cells command on the Table menu. Select the twelfth row of the table and then click the Merge Cells command on the Table menu

Chapter 11: Creating Web Applications and Writing Data to a Database 24 Adding Text to a Table HTML Control Click in the first row of the Table HTML control on the Web form. Type Employee ID: as the text label Type the text in the table cells in column 1, as shown below:

Chapter 11: Creating Web Applications and Writing Data to a Database 25 Formatting Text on the Web Form Click directly above column 1 of the Table HTML control to select the first column Click the Font Name box arrow on the Formatting toolbar and then click Arial in the Font Name list. Click the Bold button on the Formatting toolbar

Chapter 11: Creating Web Applications and Writing Data to a Database 26 Adding and Formatting a Horizontal Rule HTML Control and Viewing HTML Code for a Web Form Drag a Horizontal Rule HTML control from the Toolbox window to the second row of the Table HTML control on the Web form. Drag a second Horizontal Rule HTML control from the Toolbox window to the twelfth row of the Table HTML control on the Web form. Drag the bottom- center sizing handle of each Horizontal Rule HTML control approximately 1 pixel down to increase the width of the controls Click the HTML view button below the main work area

Chapter 11: Creating Web Applications and Writing Data to a Database 27 Adding Web Controls to the Web Form Click the Design view button and then click the Web Forms tab in the Toolbox window to display the available Web controls. Drag nine Label controls, four TextBox controls, and two Button controls from the Toolbox window to the Web form, as shown on the following slide. Size the controls as shown on the following slide. If necessary, drag the controls to place them in the appropriate cells on the Web form

Chapter 11: Creating Web Applications and Writing Data to a Database 28 Adding Web Controls to the Web Form

Chapter 11: Creating Web Applications and Writing Data to a Database 29 Changing Properties of Label and TextBox Web Controls Set the property values of the Label Web controls as shown on the following slide. If necessary, resize controls so that the text fits in each control. Resize the Label Web controls in the table so that each control fills the cell in which it is placed Set the ID properties of the four TextBox Web controls to txtEmployeeID, txtDateReviewed, txtHourlyRate, and txtAnnualSalary

Chapter 11: Creating Web Applications and Writing Data to a Database 30 Changing Properties of Label and TextBox Web Controls

Chapter 11: Creating Web Applications and Writing Data to a Database 31 Changing Properties of Button Web Controls Set the property values of the Button Web controls as shown below. If necessary, resize controls so that the text fits in each control

Chapter 11: Creating Web Applications and Writing Data to a Database 32 Adding and Changing Properties of RadioButton Web Controls Drag a RadioButton Web control to the table cell in the seventh row and second column of the HTML table Set the properties of the RadioButton1 control as shown on the following slide. Resize the control to the left side of the cell so that a second RadioButton Web control can be added next to it Add another RadioButton Web control to the right of the first RadioButton control. Set the properties for the second RadioButton Web control as shown on the following slide

Chapter 11: Creating Web Applications and Writing Data to a Database 33 Adding and Changing Properties of RadioButton Web Controls

Chapter 11: Creating Web Applications and Writing Data to a Database 34 Writing Code for a Web Application Double-click the Get Employee button on the Web form. When the code window opens, type lines 1 and 2 as shown on the following slide Enter lines 43 through 50, as shown on the following slide

Chapter 11: Creating Web Applications and Writing Data to a Database 35 Writing Code for a Web Application

Chapter 11: Creating Web Applications and Writing Data to a Database 36 Writing Code to Set Properties of Web Controls Enter lines 48 through 66, as shown below:

Chapter 11: Creating Web Applications and Writing Data to a Database 37 Completing the Code to Set Properties of Web Controls Enter lines 66 through 87, as shown below:

Chapter 11: Creating Web Applications and Writing Data to a Database 38 Writing Code to Call a Procedure in a Class Library Click the CompensationReviewUpdate.aspx tab at the top of the main work area. Double- click the Update Compensation button. When the code window opens, enter lines 95 through 103, as shown on the following slide

Chapter 11: Creating Web Applications and Writing Data to a Database 39 Writing Code to Call a Procedure in a Class Library

Chapter 11: Creating Web Applications and Writing Data to a Database 40 Saving and Testing the Project Click the Save All button on the Standard toolbar Right-click the Compensation Review Update project in the Solution Explorer. When the shortcut menu appears, click the Set as Startup Project command Click the Start button on the Visual Basic.NET Standard toolbar. When the Web page appears, type 2 in the Employee ID box and then click the Get Employee button Type 08/08/2004 in the Date reviewed box. Change the Hourly rate to Click the Update Compensation button

Chapter 11: Creating Web Applications and Writing Data to a Database 41 Saving and Testing the Project Enter 20 in the Employee ID box and click the Get Employee button Click the Close button on the Microsoft Internet Explorer window. If necessary, click the Visual Basic.NET taskbar button to display the Visual Basic.NET window. If necessary, close the Output window

Chapter 11: Creating Web Applications and Writing Data to a Database 42 Documenting the Application and Quitting Visual Basic.NET If necessary, close the Output window. Click the CompensationReviewUpdate.aspx tab, and then click the Print command on the File menu to print a record of the user interface design of the CompensationReviewUpdate Web form Click the CompensationReviewUpdate.aspx.vb tab. Click File on the menu bar and then click Page Setup When the Page Setup dialog box appears, if necessary, click Line numbers and then click the OK button

Chapter 11: Creating Web Applications and Writing Data to a Database 43 Documenting the Application and Quitting Visual Basic.NET Use the Print command on the File menu to print a record of the code for the Compensation Review Update Web application Click the Visual Basic.NET Close button

Chapter 11: Creating Web Applications and Writing Data to a Database 44 Summary Declare a public procedure in a module Use optional parameters in a procedure Use SQL SELECT statements to read individual records from a database Use SQL UPDATE statements to update individual records in a database Start a new ASP.NET Web application Understand Web applications and Web forms

Chapter 11: Creating Web Applications and Writing Data to a Database 45 Summary Explain when to use HTML controls and Web controls in a Web application Use Table and Horizontal Rule HTML controls on a Web form View HTML code for a Web form Use Label, TextBox, and Button Web controls on a Web form Test a Web application Understand how ASP.NET, the CLR, and Microsoft Internet Information Services interact to run a Web application

Visual Basic.NET Comprehensive Concepts and Techniques Chapter 11 Complete