Sort the GridView Column Using DataView in ASP.NET


Introduction

Today, I have provided an article showing you how to sort the GridView column using a DataView in ASP.NET. When binding the GridView to a Custom object or collection, you need to explicitly handle sorting for the GridView. There are many ways in which a user can sort the GridView column. We can use sorting events for the GridView. Here, you will see a DataView with sort property to sort the column of the GridView. All you have to do is implement and hook it up to your website. First of all you create a table in a SQL Server Database. Create an ASP.NET website and add a GridView to it.

Creating Table in SQL Server Database

Now create a table named UserDetail with the columns Id, Name, Country and City. Set the identity property=true for id. The table looks as in the following:

img1.jpg

Now insert data into the table.

img2.jpg

Now you have to create a web site.

  • Go to Visual Studio 2010
  • New-> Select a website application
  • Click OK

img3.jpg

Now add a new page to the website.

  • Go to the Solution Explorer
  • Right-click on the Project name
  • Select add new item
  • Add new web page and give it a name
  • Click OK

img4.jpg

First of all drag the GridView control from the Data controls on the page. The .aspx Code looks like the following code.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Sortgridviewcolumn.aspx.cs"

    Inherits="Sortgridviewcolumn" %>

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

</head>

<body>

    <form id="form1" runat="server">

    <div>

        <asp:gridview id="GridView1" runat="server" cellpadding="4" autogeneratecolumns="False">

            <columns>

        <asp:BoundField DataField="Name" HeaderText="Name" />

        <asp:BoundField DataField="Country" HeaderText="Coutry" />

        <asp:BoundField DataField="City" HeaderText="City" />

      </columns>

        </asp:gridview>

    </div>

    </form>

</body>

</html>

 

Now add the following namespace.

using System.Data.SqlClient;

using System.Data;

 

Now write the connection string to connect to the database.

 

string strConnection = "Data Source=.; uid=sa; pwd=wintellect;database=Rohatash;";

DataView

A DataView provides various views of the data stored in a DataTable. Using a DataView, you can expose the data in a table with different sort orders, and you can filter the data by row state or based on a filter expression. That is we can customize the views of data from a DataTable.

Now you can initialize the DataView class object by accessing the DefaultView property via DataTable collections of a DataSet. The DefaultView property enables you to convert a DataSet to a DataView.

DataView dv = new DataView();

         dv = dt.DefaultView ;

        dv.Sort = "NAME";

Now double-click on the page and write the following code for binding the data with the GridView. The .cs file looks like the following code:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data.SqlClient;

using System.Data;

 

public partial class Sortgridviewcolumn : System.Web.UI.Page

{

    protected void Page_Load(object sender, EventArgs e)

    {

      

        SqlConnection sconn = new SqlConnection("User ID=sa;Password=wintellect;Data Source=.; database=rohatash");

        sconn.Open();

        DataTable dt = new DataTable();

        SqlDataAdapter da = new SqlDataAdapter("SELECT * FROM UserDetail", sconn);

        da.Fill(dt);

        DataView dv = new DataView();

         dv = dt.DefaultView ;

        dv.Sort = "NAME";

        GridView1.DataSource = dt;

        GridView1.DataBind();

        sconn.Close();

    }

}

 

Now run the application and match it with a database table which is not in the sorting order.

 

img6.jpg

 

Note: You can see a demo of this article by downloading this application.