Working with the GridView control in ASP.NET 2.0

The improvements in ASP.NET 2.0 simplify data binding and presentation with the GridView control. Read about how the new data source controls make accessing data much quicker and easier.

The DataGrid control is one of the more powerful and most used ASP.NET 1.1 controls, but it has its share of limitations. Microsoft listened to at least some of the requests from developers and delivered changes with ASP.NET 2.0, including the introduction of two new data controls: GridView and DetailsView. This week, I focus on ASP.NET 2.0's GridView control.

A worthy successor

With ASP.NET 2.0, GridView takes over the reigns as the primary data control. The DataGrid control is still available, but Microsoft advises developers not to use it. The good news is that GridView provides all the functions that were available with a DataGrid control but with less development work.

Weekly .NET tips in your inbox
TechRepublic's free .NET newsletter, delivered each Wednesday, contains useful tips and coding examples on topics such as Web services, ASP.NET, ADO.NET, and Visual Studio .NET.
Automatically sign up today!

The DataGrid is a powerful control, but it can be cumbersome and a bit confusing to use. For starters, binding any data to a DataGrid requires some code writing. Also, using the more advanced features of the control like editing, deletes, and pagination requires additional coding. None of these functions are terribly difficult to understand, but the time and work involved with implementing the functions can be a bit overwhelming and often introduces errors.

The improvements in ASP.NET 2.0 simplify data binding and presentation with the GridView control. First, the new data source controls make accessing data much quicker and easier. Furthermore, the GridView control allows you to specify options like sorting, pagination, and deletion via options as opposed to lengthy code.

Using GridView controls

Listing A provides a simple example that uses a GridView control to connect and display SQL Server data. The code creates a connection to the local SQL Server and connects to the Northwind database via the SqlDataSource control. The select command retrieves all records from the Employees table. This data source is tied to the GridView control via its DataSourceID property, which corresponds to the ID property value of the SqlDataSource element.

The column headers are generated automatically using the data source column names, and the data is displayed in a standard table. Achieving the same results with an ASP.NET 1.1 DataGrid control would involve code for the database connection and tying to the DataGrid, so the GridView approach is much simpler.

GridView syntax

The first example demonstrated the most basic application of the GridView control. Let's take a closer look at the control's syntax. The following list provides a subset of these properties.

  • ID: The name assigned to the control and used to work with it in code.
  • DataSourceID: The ID assigned to the data source control used as the GridView's data source.
  • AllowSorting: A Boolean value signaling whether the GridView's data is sorted. A true value generates clickable column headers that sort the column's data when selected.
  • AllowPaging: A Boolean value signaling whether the GridView will provide paging with the page size defined in the PageSize property.
  • PageSize: The size of the page (and the number of records) to be included on each page of data.
  • AutoGenerateColumns: A Boolean value signaling whether columns are generated from the data source.
  • AutoGenerateEditButton: A Boolean value signaling whether the edit button is included.
  • BackColor: The color name or hex value assigned to the GridView background.
  • BorderColor: The color name or hex value assigned to the GridView's border.
  • BorderWidth: The width of the GridView's border.
  • Caption: The text displayed in the caption portion of the GridView.
  • Width: The display width of the GridView control.
  • Visible: A Boolean value signaling whether the control is displayed.
  • Runat: The GridView control must be set to run on the server to utilize its functionality.

You can take a closer look online at the overwhelming number of properties that may be used with the GridView control. You can utilize some of the properties from the previous list by extending the first example as Listing B demonstrates. The code presents a grid with the data from the backend data source, and you can easily sort the data as well as page through it.

Paging

There are various options available when paging through backend data. For example, links are provided to users to traverse the data. This includes previous and next pages, as well as going directly to the first or last pages. The GridView control allows you to specify the text (or images) for all paging-related links as well as the order of the links, position of the links, and whether it is visible. The following list allows you to manipulate these settings:

  • PagerSettings-FirstPageImageUrl: Assigns an image to the first page link.
  • PagerSettings-FirstPageText: Text displayed with the first page link.
  • PagerSettings-LastPageImageUrl: Assigns an image to the last page link.
  • PagerSettings-LastPageText: Text displayed with the last page link.
  • PagerSettings-Mode: Defines the order of the page links. It has the following options: NextPrevious, Numeric, NextPreviousFirstLast, or NumericFirstLast.
  • PagerSettings-NextPageImageUrl: Assigns an image to the next page link.
  • PagerSettings-NextPageText: Text displayed with the next page link.
  • PagerSettings-Position: Defines the position of the page links with respect to the GridView control. Acceptable values include Bottom, Top, and TopAndBottom.
  • PagerSettings-PreviousPageImageUrl: Assigns an image to the previous page link.
  • PagerSettings-PreviousPageText: Text displayed with the previous page link.
  • PagerSettings-Visible: A Boolean value signaling whether the paging links are displayed.

Simplified

The ASP.NET 1.x DataGrid was a welcome relief to veteran developers new to the platform, but the love affair soured quickly as they clamored for more functionality and simplified usage. ASP.NET 2.0's GridView addresses the complaints with simplified usage that often avoids backend code. You can easily connect to a data source and provide sorting, paging, editing, and more by editing the Web Form's source. Next week, I will show you how to edit, delete, and add new data with GridView.

Are you up and running with ASP.NET 2.0? What do you like or dislike about this release? Share your experiences with the .NET community.

Miss a column?

Check out the .NET Archive, and catch up on the most recent editions of Tony Patton's column.

Tony Patton began his professional career as an application developer earning Java, VB, Lotus, and XML certifications to bolster his knowledge.