How to sort the GridView data in ASP.NET?

Introduction

GridvIew control is a powerful data grid control that allows us to display the data in tabular format with sorting and pagination. It also allows us to manipulate the data as well. 

This article is for beginners.

Get hundreds of ASP.NET Tips and Tricks and ASP.NET Online training here.

In this article we are going to learn how to sort the GridView data in ascending or descending order. Let's create a sample page to see how to do this.

ASPX PAGE

<asp:GridView ID="GridView1" OnSorting="SortRecords" runat="server" 
            AllowSorting="True" CellPadding="4" DataKeyNames="AutoId" />

You may notice that on the .aspx page, we have specified OnSorting event (that fires SortRecords server side methods) and AllowSorting=true to the GridView. This will make the header of the GridView columns as link (In this case we have set AutoGenerateColumns=true to the GridView, so our GridView columns are automatically generated ). In case we are using BoundField or TemplateField, we can use SortExpression property to set the field name to sort on).

CODE BEHIND

string _connStr = ConfigurationManager.ConnectionStrings["ConnStr"].ConnectionString;
 
 
protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            BindData(); 
       }
  }
 
  protected void SortRecords(object sender, GridViewSortEventArgs e)
  {
      string sortExpression = e.SortExpression;
      string direction = string.Empty;
 
      if (SortDirection == SortDirection.Ascending)
      {
          SortDirection = SortDirection.Descending;
          direction = " DESC";
      }
      else
      {
         SortDirection = SortDirection.Ascending;
         direction = " ASC";
      }
      DataTable table = this.GetData();
      table.DefaultView.Sort = sortExpression + direction;
      GridView1.DataSource = table;
      GridView1.DataBind();
 
}
 
private void BindData()
{
    // specify the data source for the GridView
   GridView1.DataSource = this.GetData();
  // bind the data now
  GridView1.DataBind();
}

/// <summary>
/// Gets or sets the grid view sort direction.
/// </summary>
/// <value>
/// The grid view sort direction.
/// </value>
public SortDirection SortDirection
{
    get
    {
        if (ViewState["SortDirection"] == null)
        {
            ViewState["SortDirection"] = SortDirection.Ascending;
        }
        return (SortDirection)ViewState["SortDirection"];
    }
    set
    {
       ViewState["SortDirection"] = value;
    }
}

private DataTable GetData()
{
    DataTable table = new DataTable();
 
    // get the connection
    using (SqlConnection conn = new SqlConnection(_connStr))
    {
        // write the sql statement to execute
        string sql = "SELECT AutoId, FirstName, LastName, Age, Active FROM
PersonalDetail ORDER By AutoId";
            // instantiate the command object to fire
            using (SqlCommand cmd = new SqlCommand(sql, conn))
            {
               // get the adapter object and attach the command object to it
               using (SqlDataAdapter ad = new SqlDataAdapter(cmd))
               {
                   // fire Fill method to fetch the data and fill into DataTable
                   ad.Fill(table);
               }
         }
   }
   return table;
 }

In the above code snippet, first we have populated record to GridView (using BindData method) in the Page_Load event (insider Not IsPostBack, to ensure that the data binding happens only if the request is not a postback request).

When any column of the GridView is clicked, the SortRecords server side method executes that first saves the sort expression and direction (Ascending or Descending order) in the ViewState based on the previous order selected. We have a SortDirection property that saves the current sort direction in the ViewState and based on that the direction is set as ASC or DESC. As the DataSource of this GridView is DataTable so we have used Sort method of its view and set the sort expression. This will sort the rows of the DataTable. After sorting, the GridView data source has been set and the DataBind method has been called. My page output looks below that is sorted by FirstName column.

OUTPUT

Hope this article would be useful for the beginners in ASP.NET. Keep reading forthcoming articles and do not forget to refer to our friends.

Thanks and do let me know your comments.