How to hide DataGrid Column? How to hide GridView Column?
|
|
|
|
|
Downloads
If you are seeing this section and do not see download links, this means that you are not logged into our site. If you already are a member, click on the login link
and login into site and come back to this page for downloading the control files. If you are not a member, click on registration link to
become a Winista member and download the control for free.
Often times you want to hide the columns in grid view. Some times you want to hide the column completely meaning you do not want the information
to be rendered on the page at all. And there are times when you want the data for that column to be rendered on the page but not visible to
user.
If you do not want to render the column at all, then you can set Visible property for that column to False. You can
set this attribute value in ASPX page or you can set it from code behind. The following snippet shows how it is set on ASPX page.
<columns>
<asp:boundfield datafield="ProductID" visible=False />
<asp:boundfield datafield="Name" headertext="Product Name" />
<asp:boundfield datafield="ProductNumber" headertext="Product Number" />
</columns>
Now if you want to render the column data but want to hide it from the user, then using Visible property
will not work because setting that property will remove the column from the grid altogether. You can accomplish hiding
the column by setting a style on the column that sets visibility style to hidden. You can set this
at design time or run time.
<style type="text/css">
.hiddencol
{
display:none;
}
.viscol
{
display:block;
}
</style>
<columns>
<asp:boundfield datafield="ProductID" itemstyle-cssclass="hiddencol" />
<asp:boundfield datafield="Name" headertext="Product Name" />
<asp:boundfield datafield="ProductNumber" headertext="Product Number" />
</columns>
If you want to switch the visibility of column at run time or programmatically then you
can do it in RowCreated event of the grid view.
protected void OnRowCreated(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.Cells[0].CssClass = "hiddencol";
}
else if (e.Row.RowType == DataControlRowType.Header)
{
e.Row.Cells[0].CssClass = "hiddencol";
}
}
And you access the values in these hidden columns you can use the technique that I discussed in previous
article How to access gridview cell values on client side
|