Fritz Onion’s Intro to ASP.

NET
Part 3 of 4 - ADO.NET and Data
Binding (in C#)
Table of Contents
Fritz Onion’s Intro to ASP.NET Part 3 of 4 - ADO.NET and Data Binding (in C#) ............. 1
Exercise 1 Using ADO.NET to retrieve data and display it in a control .......................................................................2
Exercise 2 Databinding to a DropDownList..................................................................................................................4
Exercise 3 Binding data to a templated control .............................................................................................................5
Fritz Onion’s Intro to ASP.NET Part 3 of 4 - ADO.NET and Data Binding (in C#)

Fritz Onion’s Intro to ASP.NET Part 3 of 4 -

ADO.NET and Data Binding (in C#)
After completing this lab, you will be better able to:
Objectives a. Retrieve data from a database using ADO.NET
b. Use a DataSet to retrieve an in-memory cache of a query
ƒ Bind the results of a query to a server-side control
Before working on this lab, you must have:
Prerequisites ƒ Web development experience
ƒ Completed lab 1 and 2 in this series
ƒ Familiarity with SQL and data access

Estimated Time to 40 Minutes

Complete This Lab
See Essential ASP.NET with Examples in C#, Chapter 7
For more information

Page 1 of 5
Fritz Onion’s Intro to ASP.NET Part 3 of 4 - ADO.NET and Data Binding (in C#)

Exercise 1
Using ADO.NET to retrieve data and display it in a control

Scenario
In this exercise, you will create a new ASP.NET Web Project with Visual Studio .NET 2003 and use ADO.NET to
populate a ListBox control with the contents of the Authors table in the pubs database.

Tasks Detailed Steps

1. Create a new Web a. Click in the virtual machine window.
project with Visual b. Click the Administrator icon.
Studio .NET 2003
c. Log on with a password of password.
d. Click Start | All Programs | Microsoft Visual Studio .NET 2003 | Microsoft
Visual Studio .NET 2003.
e. Click File | New | Project….
f. Select Visual C# Projects from the Project Types section.
g. Select ASP.NET Web Application from the Templates section.
h. In the Location field type: http://localhost/AspDotNetIntroLab3/before and
click OK.
Note that we are using the technique of creating the virtual directory in which our site
lives before creating the Visual Studio .NET project in these labs (which is why you
ran the creatvdirs.exe utility during setup) - if you don't have the virtual directory pre-
created, Visual Studio .NET will create one for you at that location on the machine.
2. Change the webform a. Right-click on the WebForm1.aspx file in your Solution Explorer and select
to be named Rename.
Default.aspx b. Type in Default.aspx as the new file name and press Enter.
3. Change the page a. Right-click on the design space of Default.aspx and select Properties.
layout to 'flow' b. Change the value of the PageLayout drop-down box from GridLayout to
FlowLayout.
c. Click OK.
This avoids the idiosyncrasies associated with fixed positioning in HTML.
4. Add a ListBox a. Drag and drop a ListBox control from the Toolbox onto the form.
control to the page b. In the Properties windows on the right set the ID of the ListBox to
authorsListBox.
5. Populate the ListBox a. Click View | Code (or press F7) to view the code-behind file for your page.
with the names of all b. Add a using directive for System.Data.SqlClient to the top of the file
the 'authors' from the
using System.Data.SqlClient;
Pubs database
c. In the Page_Load handler, add the following code by pasting Snippet1 from
c:/labs/Snippets/Lab3 Snippets:
using (SqlConnection conn = new
SqlConnection("server=.;trusted_connection=yes;database=pu
bs"))
using (SqlCommand cmd = new
SqlCommand("SELECT au_fname + ' ' + au_lname AS name,

Page 2 of 5
Fritz Onion’s Intro to ASP.NET Part 3 of 4 - ADO.NET and Data Binding (in C#)
Tasks Detailed Steps
au_id FROM authors", conn))
{
conn.Open();
SqlDataReader reader =
cmd.ExecuteReader();
while (reader.Read())
authorsListBox.Items.Add(new
ListItem(reader.GetString(0),

reader.GetString(1)));

reader.Close();
}
This uses a SqlConnection, SqlCommand, and SqlDataReader to retrieve all of the
authors from the pubs database and insert each author's name as a new ListItem in
the authorsListBox control.
6. Compile and test! a. In the Solution Explorer right-click Default.aspx and select Set As Start Page.
b. Click Debug | Start Without Debugging (or press Ctrl-F5) to run the page.
c. Verify that the list box is populated with all of the authors from the Pubs database
and close the Internet Explorer window.

Page 3 of 5
Fritz Onion’s Intro to ASP.NET Part 3 of 4 - ADO.NET and Data Binding (in C#)

Exercise 2
Databinding to a DropDownList

Scenario
In this exercise, you will use the ADO.NET DataSet class to retrieve the contents of the Authors table and bind the
results to a DropDownList.

Tasks Detailed Steps

1. Add a a. Switch to the design mode of the Default.aspx form.
DropDownList to b. Click after the ListBox in the design space and press Enter.
your default.aspx
c. Drag and drop a DropDownList control from the toolbox onto the form in the
form
space below the ListBox.
d. In the Properties window set the ID of the DropDownList to
authorsDropDownList.
2. Populate the a. Switch to the code-behind view of the Default.aspx form.
DropDownList with b. In your Page_Load handler, just below the code you added in the previous
a DataSet populated exercise (ending in reader.Close();), add the following code by pasting
with the contents of Snippet2:
the Authors table
SqlDataAdapter da = new SqlDataAdapter("SELECT au_fname +
from the pubs
' ' + au_lname AS name, au_id FROM authors",
databse
"server=.;trusted_connection=yes;database=pubs");
DataSet ds = new DataSet();
da.Fill(ds);
This creates a DataSet and a SqlDataAdapter, and fills the DataSet with data from the
Authors table.
c. Set the DataSource property of the authorsDropDownList to the newly
populated DataSet by adding the following code:
authorsDropDownList.DataSource = ds;
d. Set the DataTextField of the authorsDropDownList to name by adding the
following code:
authorsDropDownList.DataTextField = "name";
e. Set the DataValueField of the authorsDropDownList to au_id by adding the
following code:
authorsDropDownList.DataValueField = "au_id";
f. Call the DataBind() method of the authorsDropDownList by adding the
following code:
authorsDropDownList.DataBind();
3. Compile and test! a. Click Debug | Start Without Debugging (or press Ctrl-F5) to run the page.
b. Verify that the list box is populated with all of the authors from the Pubs database
and close the Internet Explorer window.

Page 4 of 5
Fritz Onion’s Intro to ASP.NET Part 3 of 4 - ADO.NET and Data Binding (in C#)

Exercise 3
Binding data to a templated control

Scenario
In this exercise, you will trying binding the same DataSet you populated from the last part to a DataList, and will
define an ItemTemplate to render the elements of the query.

Tasks Detailed Steps

1. Add a new DataList a. Switch to the design view of the Default.aspx form.
control to your b. Click after the DropDownList in the design space and press Enter.
default.aspx form
c. Drag and drop a DataList control from the Toolbox underneath the
DropDownList added earlier.
d. In the Properties window set the ID of the DataList to authorsDataList.
e. Set the RepeatColumns property to 4.
f. Set the RepeatDirection property to Horizontal.
g. Switch to the code-behind view of Default.aspx (Default.aspx.cs).
h. Set and bind the new DataSource for the DataList.
i. The code should look like the following:
authorsDataList.DataSource = ds;
authorsDataList.DataBind();
2. Build an a. Switch to the HTML view of the Default.aspx page
ItemTemplate in the b. Within the DataList control, add the new sub-element:
DataList to display
<ItemTemplate>
author data
</ItemTemplate>
c. Add a data-binding expression in the new sub-element to retrieve the author's id
and render it in bold followed by a break:
<b><%# DataBinder.Eval(Container.DataItem, "au_id") %></b>
<br />
d. Add another data-binding expression in the new sub-element to retrieve the
author's name and render it in italics followed by another break:
<i><%# DataBinder.Eval(Container.DataItem, "name") %></i>
<br />
3. Compile and test! a. Click Debug | Start Without Debugging to compile and run the application.
b. Verify that the authors are displayed properly in your new DataList control and
close the Internet Explorer window.

Page 5 of 5