In this article I will explain with an example, the concept of Hidden Columns in ASP.Net GridView i.e. how to hide a particular column value in GridView and then use it processing in C# and VB.Net.
The database columns can be hidden by binding it to DataKeyNames (DataKeys) property of the ASP.Net GridView.
What are DataKeyNames and DataKeys?
DataKeyNames is the property of GridView which allows us to set the names of the Column Fields, that we want to use in code but do not want to display it. Example Primary Keys, ID fields, etc.
The values Column Fields which are set in
DataKeyNames are available in code in
DataKeys object which saves it in an Array called as
DataKeyArray.
HTML Markup
The following HTML Markup consists of:
GridView – For displaying the records.
Columns
The GridView consists of two BoundField columns and one TemplateField column consisting of a Button control.
Properties
The GridView has been assigned with a DataKeyNames property.
The Button has been assigned with an OnClick event handler.
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" DataKeyNames="Id">
<Columns>
<asp:BoundField DataField="Name" HeaderText="Name" />
<asp:BoundField DataField="Country" HeaderText="Country" />
<asp:TemplateField>
<ItemTemplate>
<asp:ButtonID="btnGet" Text="Get Value" runat="server" OnClick="OnGet" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
Namespaces
You will need to import the following namespace.
C#
VB.Net
Binding the GridView
Inside the Page Load event handler, the GridView is populated with data by making use of a Dynamic DataTable with some records.
C#
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
DataTable dt = new DataTable();
dt.Columns.AddRange(new DataColumn[3] {
new DataColumn("Id"),
new DataColumn("Name"),
new DataColumn("Country") });
dt.Rows.Add(1, "John Hammond", "United States");
dt.Rows.Add(2, "Mudassar Khan", "India");
dt.Rows.Add(3, "Suzanne Mathews", "France");
dt.Rows.Add(4, "Robert Schidner", "Russia");
GridView1.DataSource = dt;
GridView1.DataBind();
}
}
VB.Net
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
If Not Me.IsPostBack Then
Dim dt As New DataTable()
dt.Columns.AddRange(New DataColumn(2) {
New DataColumn("Id"),
New DataColumn("Name"),
New DataColumn("Country")})
dt.Rows.Add(1, "John Hammond", "United States")
dt.Rows.Add(2, "Mudassar Khan", "India")
dt.Rows.Add(3, "Suzanne Mathews", "France")
dt.Rows.Add(4, "Robert Schidner", "Russia")
GridView1.DataSource = dt
GridView1.DataBind()
End If
End Sub
Getting the DataKeys value for a particular GridView Row
When Get Value Button is clicked, first the GridView Row is determined using the NamingContainer property.
Then, using the
Row Index, the
DataKeys array is accessed and the value of the Column is fetched.
Finally, the DataKey is displayed using JavaScript Alert Message Box using RegisterStartupScript method.
C#
protected void OnGet(object sender, EventArgs e)
{
//Determine the RowIndex of the Row whose Button was clicked.
int rowIndex = ((sender as Button).NamingContainer as GridViewRow).RowIndex;
//Get the value of column from the DataKeys using the RowIndex.
int id = Convert.ToInt32(GridView1.DataKeys[rowIndex].Values[0]);
ClientScript.RegisterStartupScript(this.GetType(), "alert", "alert('DataKey: " + id + "');", true);
}
VB.Net
Protected Sub OnGet(sender As Object, e As EventArgs)
'Determine the RowIndex of the Row whose Button was clicked.
Dim rowIndex As Integer = TryCast(TryCast(sender, Button).NamingContainer, GridViewRow).RowIndex
'Get the value of column from the DataKeys using the RowIndex.
Dim id As Integer = Convert.ToInt32(GridView1.DataKeys(rowIndex).Values(0))
ClientScript.RegisterStartupScript(Me.GetType(), "alert", "alert('DataKey: " & id & "');", True)
End Sub
Screenshot
Demo
Downloads