Paging and Sorting in ASP.NET GridView

The ASP.NET GridView control is used to display the values of a data source in a table. ASP.NET provides the sorting feature in a GridView Control. The records displayed in a GridView control can be sorted in ascending or descending order.


In this article I will explain how to do paging and sorting in ASP.NET GridView.

The following is the step-by-step explanation.

Step1: Create a table in the database.

  1. CREATE TABLE [dbo].[Teacher](
  2. [TeacherId] [int] NULL,
  3. [FirstName] [varchar](50) NULL,
  4. [LastName] [varchar](50) NULL,
  5. [Status] [varchar](50) NULL,
  6. [Nationality] [varchar](50) NULL,
  7. [Grade] [nchar](10) NULL
  8. ) ON [PRIMARY]

Step 2: Create a new ASP.NET web application and drag a GridView control in the Default.aspx design view. Set the property AllowSorting="true".

Step 3: Write the following in the page load event:

  1. if (!Page.IsPostBack)
  2. {
  3. gvTeacher.DataSource = BindGridView();
  4. gvTeacher.DataBind();
  5. }

Step 4: The BindGridView() method populates the data in the GridView. Write the following method in the Default.aspx.cs file:

  1. protected void gvTeacher_Sorting(object sender, GridViewSortEventArgs e)
  2. {
  3. string sortingDirection = string.Empty;
  4. if (direction == SortDirection.Ascending)
  5. {
  6. direction = SortDirection.Descending;
  7. sortingDirection = "Desc";
  8. }
  9. else
  10. {
  11. direction = SortDirection.Ascending;
  12. sortingDirection = "Asc";
  13. }
  14. DataView sortedView = new DataView(BindGridView());
  15. sortedView.Sort = e.SortExpression + " " + sortingDirection;
  16. Session["SortedView"] = sortedView;
  17. gvTeacher.DataSource = sortedView;
  18. gvTeacher.DataBind();
  19. }

Note: GridViewSortEventArgs is used to perform GridView sorting. There are two properties.

SortDirection specifies the direction to sort the GridView column, either by ascending or descending order.

Step 5: Select the GridView and double-click on PageIndexChanging .Write the following code:

  1. protected void gvTeacher_PageIndexChanging(object sender, GridViewPageEventArgs e)
  2. {
  3. gvTeacher.PageIndex = e.NewPageIndex;
  4. if (Session["SortedView"] != null)
  5. {
  6. gvTeacher.DataSource = Session["SortedView"];
  7. gvTeacher.DataBind();
  8. }
  9. else
  10. {
  11. gvTeacher.DataSource = BindGridView();
  12. gvTeacher.DataBind();
  13. }
  14. }

Step 6: Now maintain the SortDirection (Ascending or Descending) in ViewState by adding the following code.

  1. public SortDirection direction
  2. {
  3. get
  4. {
  5. if (ViewState["directionState"] == null)
  6. {
  7. ViewState["directionState"] = SortDirection.Ascending;
  8. }
  9. return (SortDirection)ViewState["directionState"];
  10. }
  11. set
  12. {
  13. ViewState["directionState"] = value;
  14. }
  15. }

Step 7: The First Name is in ascending order as in the following:


The First Name in descending order as in the following: