Buy the Book! 5-Star Rating at Amazon.com! Amazon.com ratings updated weekly... Advertisements

There are often times with the DataGrid when you will need to access the value in a particular column of a particular row. One of the most common examples of this is when using the DataGrid to edit database data. In this scenario, after the user makes a row editable, edits the values, and then clicks the Update button, you need to programmatically determine the updated values and perform a database update.

The two DataGridColumn types you're likely to need to access values from are the BoundColumn and the TemplateColumn. This FAQ focuses on programmatically accessing the value from a particular BoundColumn in a particular DataGrid row. To see how to access the values from a TemplateColumn, be sure to read the Accessing TemplateColumn Contents FAQ.

DataGrids, DataGridItems, and BoundColumns, Oh My!
A DataGrid is constructed of zero to many DataGridItems objects. Each DataGridItem object represents a single row in the DataGrid, and precisely one DataGridItem is created for each item in the DataGrid's DataSource. For example, if you are binding a DataGrid to the results of a SQL query that contains six records, the DataGrid, obviously, will have six rows; each row will be represented as a DataGridItem, meaning the DataGrid will have six DataGridItem objects associated with it. The DataGrid's set of DataGridItem objects can be accessed via the DataGrid's Items property.

Realize that the DataGridItem class is derived from the TableRow class. This makes sense since each row in a DataGrid is rendered as a row in an HTML table. Not surprisingly, the TableRow class has a Cells property, which is a collection of TableCell instances. Since the DataGridItem class is derived from TableRow, the DataGridItem class also has this Cells property.

When binding the DataSource to the DataGrid, the DataSource's contents are enumerated, and each record in the DataSource is bound to the DataGridItem created for that particular DataGrid row. If the DataGrid has a BoundColumn for a particular column, then the corresponding Cells entry in the DataGridItem has its Text property assigned to the corresponding value in the current DataSource record.

Let me try to explain this in English! Imagine that our SQL query returns six records from the Employees database table, specifically returning three fields: Name, Salary, and SSN. Now, imagine that our DataGrid has two BoundColumns, one to display the SSN field and one to display the Name field. When we bind the SQL query results to the DataGrid, the six records are enumerated, and for each record a DataGridItem is created. The current record is then bound to the just-created DataGridItem. The DataGrid realizes that it has a BoundColumn as its first column, and that the BoundColumn's DataField is SSN, so it assigns the Text property of the DataGridItem's first Cells instance to the value of the SSN database field in the current DataSource row. Likewise for the Name column/field. (Reading back over this paragraph I wonder if I might only be confusing you further!)

Programmatically Accessing the Value of a BoundColumn
Imagine that you decide to add a ButtonColumn to the DataGrid and you want to have it whenever a DataGrid's row's button is clicked, the value of one of the BoundColumns is displayed. This can be accomplished using the following DataGrid:

Nothing too fancy here. This DataGrid will display five articles from the Recommended Articles database table. Note that we have a ButtonColumn as the first column, and then two BoundColumns. The first BoundColumn displays the Title field, while the second BoundColumn displays the Comments field. Furthermore, the DataGrid's ItemCommand event is wired up to the DisplayBoundColumnValues event handler, which we'll examine shortly.

Now, when the button in the ButtonColumn is clicked, the Web Form will be posted back and the DataGrid's ItemCommand event will fire, causing the DisplayBoundColumnValues event handler to execute. In this event handler we simply want to display the values of the two BoundColumns. This can be accomplished with the following code:

View a Live Demo!

In this event handler, the second parameter - the DataGridCommandEventArgs - passes in the DataGridItem that caused the event. (I.e., the DataGridItem whose ButtonColumn button was clicked.) Specifically, this DataGridItem can be accessed via e.Item. Then, to access the value of a particular BoundColumn we access the appropriate Cells instance and then reference the Text property. (Note that the Cells collection is indexed at zero; therefore, to access the first column in the DataGridItem we'd use Cells(0) in VB.NET, or Cells[0] in C#. Since the first BoundColumn is in actuality the second DataGrid column, we use Cells(1).)

Retrieving the Result from an Editable BoundColumn
Accessing the value from a non-editable BoundColumn, as we just saw, is fairly simple and straightforward. Oftentimes, though, we are interested in accessing the value from a BoundColumn that has been edited. With the DataGrid's built-in editing features, when the user selects a particular row to edit by clicking the Edit button, that row becomes editable. When a row becomes editable, all of its BoundColumns are automatically converted to BoundColumns containing a TextBox Web control. (For more information on the DataGrid's editing features, be sure to read Using the DataGrid's Built-In Editing Features!)

After the user edits the various columns in the editable row, they will click the Update button, which will cause a postback and will fire the DataGrid's UpdateCommand event. In the event handler for the UpdateCommand, the second parameter is of type DataGridCommandEventArgs, meaning you can access the DataGridItem whose Update button was clicked via e.Item. Again, you can access the BoundColumn using e.Item.Cells(index) for VB.NET or e.Item.Cells[index] for C#.

However, to determine the value the user entered into the TextBox Web control, you don't want to access the Text property of the Cells(index) object; rather you want to first grab the actual TextBox Web control that is sitting inside of the Cells(index) object, and then access the TextBox Web control's Text property. To access the TextBox Web control inside the Cells(index) object you can simply access the first item in the Cells(index) object's Controls collection using the following code:

Therefore, the UpdateCommand event handler for your DataGrid might look like the following:

The source code examples here assume that the DataGrid has two BoundColumn as the second and third DataGrid columns (as was the case with the previous example and live demo).