Tech Junkie Blog - Real World Tutorials, Happy Coding!: ASP.NET GridView : Display Less Columns With "Edit Columns"

Wednesday, July 23, 2014

ASP.NET GridView : Display Less Columns With "Edit Columns"

Usually when you use the Query Builder feature to build your query you leave the "*" in the select statement.  Th problem with the "*" select statement is that it selects all the columns in the table.  This can sometimes make your GridView very big with all the columns in the table being displayed.

In this tutorial we will display only the columns that we want our users to see.  This tutorial assumes that you've created a GridView with the "*" selected on the "Northwind", "Products" table.

1.  Click on the ">" icon on the right hand side of the GridView control, the "GridView Tasks" panel will appear




2.  Click on the "Edit Columns" link


3.  Select the "SupplierID" field in the "Selected fields" list box then click on the "X" button



4.  Select the "CategoryID" field in the "Selected fields" list box then click on the "X" button


5.  Select the "ProductID" field in the "Selected fields" list box then click on the "X" button


6.  Now the "Selected fields" will have not have the "ProductID,CategoryID,SupplierID".  The remaining fields are the fields that will be displayed on the GridView.  Noticed the "Available Fields" list box, it still contain all the fields that you've selected.  That means you can perform functions on those fields, the fields just won't be displayed anymore.


7.  Click "OK"


8.  As you can see the GridView only has the fields that you've selected in the "Selected fields" list box


9.  Type Ctrl+F5 to run the application and see the new GridView with less columns





1 comment:

Search This Blog