Easily manipulate data with the GridView control in ASP.NET 2.0

by Tony Patton | Mar 06, 2007 2:38:00 PM

Tags: .NET, Middleware, Microsoft development tools, Tony Patton, ASP.NET 2.0, GridView, server control, HTML Text, Microsoft ASP.NET, TemplateField, .NET Newsletter

6 comment(s)

Takeaway: Tony Patton recently introduced ASP.NET 2.0's GridView data control and covered the basics of using it. In part two of this series, he demonstrates how the GridView control makes it easy to view, edit, and delete data.

Last week, I introduced ASP.NET 2.0's GridView data control and covered the basics of using it. This week, I go a step further by going into the details of working with the data contained in the control. This includes viewing, editing, and deleting data. Thankfully, the GridView control makes it easy to utilize these features. Before diving into these topics, I begin with an examination of the different field types supported by the GridView control.

Field types

The GridView control supports the following field types:

BoundField: Displays the value of a field as a string of text.
ButtonField: Displays a user-specified button.
CheckboxField: Displays a checkbox when the value of field is a Boolean value.
CommandField: Automatically generates a command button such as an Edit, Update, or Cancel button.
HyperLinkField: Displays the value of a field as a hyperlink.
ImageField: Automatically displays an image when the value of a field represents an image.
TemplateField: Enables a user to customize the appearance of a column by supplying a template.

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!

You can use these field types to control the look and feel of the data and other elements bound to a GridView control. Listing A includes a GridView control that displays column values from the attached query with BoundField elements.

If you need to display fields as images, buttons, or hyperlinks, then the corresponding field types can be used, but the TemplateField type provides an opportunity to customize a column's appearance. It has the following syntax:

<asp:TemplateField
HeaderStyle-property="value"
ItemStyle-property="value"
FooterStyle-property="value">

<HeaderTemplate>

HTML, text or server controls

</HeaderTemplate>

<ItemTemplate>

HTML, text or server controls

</ItemTemplate>

<AlternatingItemTemplate>

HTML, text or server controls

</AlternatingItemTemplate>

<FooterTemplate>

HTML, text or server controls

</FooterTemplate>

</asp:TemplateField>

The approach will not be new if you used template fields in ASP.NET 1.x. Listing B demonstrates one possible use of a TemplateField for displaying data. The many options available for formatting and displaying fields allows you to easily meet customer demands.

Editing data

While allowing users to view and sort data, another common requirement is editing the data. The GridView data control makes it easy with its AutoGenerateEditButton property and via the UpdateCommand property of the related database connection.

The SqlDataSource element provides the UpdateCommand property to define the SQL that is used when/if data is edited and saved by the user. This is tied to the GridViewcontrol's edit functionality via the DataSourceID property (assigned to SqlDataSource). Also, the DataKeyNames property of the SqlDataSource element allows you to specify the primary key or set of keys for data rows within the GridView. Listing C uses this approach to allow the user to edit and update GridView data.

Deleting data

Along the same line as the edit capability, the GridView control makes it easy to allow users to delete individual data rows from a GridView control. Once again, the SqlDataSource control is used along with its DeleteCommand property to control how the delete is executed.

The AutoGenerateDeleteButton property of the GridView control tells the system to generate a delete button (true) or not (false). When the delete button is selected by the user, the data values from the selected row are passed to the SQL statement defined in the SqlDataSource'sDeleteCommand property and the SQL command is issued. Listing D extends the previous sample to incorporate delete functionality.

Easy to use

ASP.NET 1.x's DataGrid control is powerful, but its features can be a bit time consuming to implement. The GridView control included in ASP.NET 2.0 steps in to supply just as much power and flexibility with much less complexity. When you combine it with the new SqlDataSource control, you can be up and running with powerful features in no time. You can easily provide data access with no C# or VB.NET coding.

Have you made the switch to the latest version of the .NET Framework? If so, share your thoughts about it with the community, or let us know why you haven't switched.