Objective: Create a web page that accesses data from a SQL* data source. You will need to create the TechSupport DB if you have not already.

Start by creating a new ASP.NET Web Application project in Visual Studio called SportsPro.

You will need the TechSupport SQL database (Tips & Resources -> Database Files -> TechSupport DB ->Pre-Build SQL Server DB). Save it to your PC, then import it to your project, specifically into the App_Data folder.

Create the Customer Display page. It should look similar to the attached image (Sportspro.jpg).

Use a table to align the address, phone, and email information.

Use any fonts, colors, and sizes you like for the two headings.

Create a SQL data source that retrieves all the rows and columns from the Customers table, sorted by the Name column (Figures 4.9 – 4.11).

Bind the drop-down list to this data source so that the Name column is displayed for each item in the list and the CustomerID column is stored as the value of each item.

Create a class named Customer that contains public fields.

The easiest way to do this is to right-click the App_Code folder, then click Add.

Then, let the menu expand out, and then choose Class.

Change the name of the new class to Customer before you go any further. Be certain to save it in the App_Code folder. This will be similar to the Product class in the top of Figure 4-16, adjusted, of course, for the TechSupport Customer table fields. Only a Customer class is required for this portion of the project.

You will also need to add the System.Data class from the class library. Consult Figure 4-19 for the syntax to include this in your code file (Hint: C#: using, VB: imports).

Create a method called GetSelectedCustomer that will use the Customer class to create a Customer object that contains the information for the selected customer. Create a data view from the data source and then filter the data view so it consists of just the row for the selected customer. Your code should look similar to the code in Figure 4-19 adjusted for the tech support customer instead of a product. Return the Customer object that you created.

On the ASPX page, be sure to check the EnableAutoPostBack attribute in the dropdownlist smart tag menu to trigger a page reload anytime the selection is changed. This will force the code to execute that will show the newly selected customer’s data on the page.

When the page is displayed, the information for the first customer in the drop-down list should display on the page. To add this code, you will need to add a Page_Load event to the codebehind by double-clicking somewhere in a blank area of the Design View of the page.In this event, add code that will do the following:

If this is the first time the page is loaded (Hint: If Not/! IsPostBack), then bind the database to the dropdownlist (ddlCustomer.DataBind)

Call the GetSelectedCustomer method and assign it to a Customer object.

Display the address, phone and email from the selected customer in the correct label fields.

Include your name on the page. The title field works well for this.

Test your project to make sure that it works. Be sure that when you select a new customer that you see refreshed customer data.

The attached pdf file

Project 1-A: Display customers For this project, you’ll create a page named CustomerDisplay.aspx that displays information for a selected customer. To do that, you’ll use a SQL data source. (Required reading: section 1) The design of the Customer Display page Operation  When the page is first displayed, the information for the first customer in the drop-down list is displayed on the page. After that, the information for the customer that the user selects from the drop-down list is displayed. Specifications  Create a class named Customer that contains a public property for each column in the Customers table. Then, use this class to create a Customer object that contains the information for the selected customer.  Add a SQL data source to the page that retrieves all the rows and columns from the Customers table and sorts them by the Name column. When you create the connection for this data source, you should save it in the web.config file. Then, bind the drop-down list to this data source so the Name column is displayed for each item in the list and the CustomerID column is stored as the value of each item.  To get the data for a selected customer, create a data view from the data source and then filter the data view so it consists of just the row for the selected customer.  Use a table to align the address, phone, and email information.  Create a style sheet that contains the basic formatting for the page as shown above. Use any color you like for the border and any fonts, colors, and sizes you like for the two headings.