There are still several of people who posts questions about changing the GridView dynamically. I will in this post explain some basics about how to change the GirdView.
When you bind data to a GridView, you can get access to the current row that is data bound by using the RowDataBound event:
VB.Net:
Protected Overridable Sub OnRowDataBound(ByVal e As GridViewRowEventArgs)
C#:
protected virtual void OnRowDataBound(GridViewRowEventArgs e);
The RowDataBound event will be trigged if the Header, rows, Pager and Footer etc is rendered.
The RowDataBound event takes two arguments, the “source” which is the instance of the GridView control, and the “e” which is of type GridViewRowEventArgs. The GridViewRowEventsArgs gives us all the information you need to get access to a row. By using the Row property of the GridViewRowEventsArgs you will get access to the current row that is data bound. The Row is of type GridViewRow. Let’s take a look at two basic properties of the GridViewRow that you will probably use often when you want to modify the GridView.
RowType, return the type of the row, for example if it’s a Header or normal row etc.
RowState, return the state of the row, for example if the row is in edit state, normal state or a selected state etc.
The RowType is a DataControlRowType enum. The value of the enum is the following:
DataRow
EmptyDataRow
Footer,
Header
Pager
Seperator
The GridViewRow will have the RowType DataRow if the row that is currently data bound is a normal row. A normal row is a row that displays the data from the data source. If you bind empty data to the GridView and use the EmptyDataTemplate, the GridViewRow will have its type set to EmptyDataRow. If the row is a header or footer, it will have the state Header or Footer. If we have enable Paging and the GridView reach the row that represents the pager, it will have the type Pager. The following code will check if the current row is a Header row:
VB.Net:
Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound
If e.Row.RowType = DataControlRowType.Header Then
End If
End Sub
C#:
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.Header)
{
}
}
The code you put inside the body of the “if” block will only be called when the row is the header of the GridView. If you are only interested in the row that should display the data you bind to the GirdView, you can instead check if the type is a DataRow:
VB.Net:
If e.Row.RowType = DataControlRowType.DataRow Then
End If
C#:
if (e.Row.RowType == DataControlRowType.DataRow)
{
}
If you need to know what state a row is in, you can use the RowState property of the GridViewRow. The RowState can be the following:
Alternate
Edit
Insert
Normal
Selected
If you have selected a row, the state of the row will be Selected. If the row is a normal row (not selected, not in edit mode etc) the state is Normal. If you have marked a row for edit, the state is Edit. Every other row in the GridView has the state set to Alternate. The following figure shows both the RowType and the RowState values of a GridView:
If you want to get access to the columns for the current row that is data bound, you can use the Cells property of the GridViewRow:
e.Row.Cells
The Cells collection is zero based and has a list of TableCell objects, so to get the second column in a GridView, you use the index 1:
VB.Net:
e.Row.Cells(1)
C#
e.Row.Cells[1]
If you only use a BoundField in your GridView:
<asp:GridView ID="GridView1" …>
<Columns>
<asp:BoundField DataField="CustomerID" HeaderText="CustomerID" .../>
<asp:BoundField DataField="CompanyName" HeaderText="CustomerID" .../>
...
</Columns>
</asp:GridView>
You can use the Text property of the TableCell to get access to the value of a specified column, or also change the value:
VB.Net:
Dim customerId As String = e.Row.Cells(0).Text
e.Row.Cells(0).Text = “New value for the first column”
C#
String customerId = e.Row.Cells[0].Text;
e.Row.Cells[0].Text = “New value for the first column”;
The TableCell object also has style properties etc, so you can easy change the style of a table cell. For example maybe you want to set the background color of a cell to be a specific color based on the cells value. The following is an example how you can do that, it will check if the second column has the value ANTON, if it has, the columns background color will be set to red:
VB.Net:
Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound
If e.Row.RowType = DataControlRowType.DataRow Then
If e.Row.Cells(1).Text = "ANTON" Then
e.Row.Cells(1).Style.Add("background-color", "red")
End If
End If
End Sub
C#
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
if (e.Row.Cells[1].Text == “ANTON”)
{
e.Row.Cells[1].Style.Add(“background-color”,”red”);
}
}
}
It can sometimes be stupid to use the Text property and get the value in a cell because the value can be changed if we format values etc. So another way (which I think is better) is to get access to the “raw” object that is bind to the current view. This can be done by using the DataItem property of the GridViewRow object:
e.Row.DataItem
If you have bound a collection of your own objects to the GridView, for example a list of Customer, you can cast the DataItem to Customer to get access to the Customer interface and its values:
VB.Net:
Dim customer As Customer = DirectCast(e.Row.DataItem, Customer)
C#
Customer customer = (Customer)e.Row.DataItem;
So instead of using the Text property of the TableCell to see if a column has a specific value, you can now use the DataItem to get the “raw” data:
VB.Net:
Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound
If e.Row.RowType = DataControlRowType.DataRow Then
Dim customer As Customer = DirectCast(e.Row.DataItem, Customer)
If customer.ID = "ANTON" Then
e.Row.Cells(1).Style.Add("background-color", "red")
End If
End If
End Sub
C#
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
Customer customer = (Customer)e.Row.DataItem;
if (customer.ID == “ANTON”)
{
e.Row.Cells[1].Style.Add(“background-color”,”red”);
}
}
}
If you don’t use a BoundField and instead use a TemplateField and want to modify the controls inside of the template, you can use the FindControl method of the TableCell to find a control located inside of your template. For example:
<asp:GridView ID="GridView1" ...>
<Columns>
<asp:BoundField DataField="CustomerID" ... />
<asp:TemplateField HeaderText="CompanyName" ...>
<ItemTemplate>
<asp:Label ID="Label1" runat="server" Text='<%# Bind("CompanyName") %>'/>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
If you want to get the Label control from your second column in the GridView above you write something like this:
VB.Net:
Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound
If e.Row.RowType = DataControlRowType.DataRow Then
Dim myLabel As Label = DirectCast(e.Row.Cells(1).FindControl(“Label1”))
End If
End Sub
C#
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
Label myLabel = (Label)e.Row.Cells[1].FindControl(“Label1”);
}
}
You can also use the Controls property of the TabelCell to get a control if you know the index (position) of the control in the control collection.
You can also use the GridViewRow’s FindControl to locate the control in a column. For example:
VB.Net:
Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowDataBound
If e.Row.RowType = DataControlRowType.DataRow Then
Dim myLabel As Label = DirectCast(e.Row..FindControl(“Label1”))
End If
End Sub
C#
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
Label myLabel = (Label)e.Row.FindControl(“Label1”);
}
}
Summary
In this post you have seen how you can use the RowDataBound event to get access to different type of rows. You have also seen how you can get a value out from a column and also how easy it’s to customize a column, for example changing the background color based on a value. You have also seen how easy it’s to find a control if a TemplateField is used instead of a BoundField.
