The ability to draw information from a database and display it on a Web page has previously been a fairly complicated task. Not so with ASP.NET. Because ASP.NET uses Providers and has the ability to deal with data natively, you don’t need to write any programming code to display data from a database on your Web pages.
ASP.NET can work with Microsoft Office Access databases, Microsoft SQL Server databases, XML files, Microsoft Office Excel files, and even Oracle, IBM DB2, and MySQL databases.
In this exercise, you will display information from a Microsoft Office Access database in your Web page.
Note
USE the CH11 sample site you modified in the previous exercise.
OPEN the CH11 site if it isn’t already open.
In the Folder List task pane, expand DotNetVersion, expand about, and then double-click staff.aspx to open it for editing. Click ContentPlaceHolder1 in the Design pane, and then click the small arrow button in its upper-right corner. Click Create Custom Content, and then click inside ContentPlaceHolder in the Design pane.
Click the <asp:content#Content1> arrow on the quick tag selector bar, and then click Select Tag Contents.
In the Toolbox task pane, expand ASP.NET Controls, expand Data, and then double-click GridView to replace the content placeholder’s content with an ASP.NET GridView control.
In the Common GridView Tasks pop-up window, in the Choose Data Source box, click New data source. In the Data Source Configuration Wizard, click Access Database, and then click OK.
In the Configure Data Source dialog box, click Browse, click CH11 in the root of the site, and then click Open.
Click Next. This part of the wizard helps you select the data you want to display. In the Name box, click Employees. In the Columns list, select the LastName, FirstName, Business_Phone, and Job_Title check boxes.
Click Next. On the Test Query page, click Test Query to make sure that you are connecting to the database.
If the query functions properly, you will see a table of the data that you selected in step 6.
Click Finish to close the Configure Data Source Wizard.
You now have a GridView control in your page.
On the toolbar, click Save, and then click Preview to view the page and its grid view in a browser.
Close the browser window, and examine the grid view that you inserted into the page.
Notice that there are now more options on the Common GridView Tasks pop-up window.
Click Edit Columns to open the Fields dialog box.
In the Selected Fields list, click Business_Phone, and then under BoundField properties, in the HeaderText box, replace Business_Phone with Phone. Repeat the process to replace Job_Title with Title, and then click OK.
In the Common GridView Tasks pop-up window, select the Enable Paging and the Enable Sorting check boxes.
With the GridView control still selected, in the Tag Properties task pane, type 400px in the width box.
On the toolbar, click Save, and then click Preview to preview the page in a browser.
Notice that the column headers are now hyperlinks that sort the rows below them, in addition to having a space between First Name and Last Name.
Creating a connection to a database, and then selecting the data you want and writing it into a page was a fairly technical and difficult task in the past. With ASP.NET and Expression Web, you can do all that, and more, without writing a single line of code.
It’s more impressive as you dig deeper into the capabilities provided by these data source controls and data views. If you’ve ever had to write code by hand, you will undoubtedly appreciate the added, advanced features that are available, such as Enable Sorting.