Hi Babloo22,
Refer the below sample.
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
body
{
font-family: Arial;
font-size: 10pt;
}
table
{
border: 1px solid #ccc;
}
table th
{
background-color: #F7F7F7;
color: #333;
font-weight: bold;
}
table th, table td
{
padding: 5px;
border-color: #ccc;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" AllowSorting="True"
OnSorting="GridView1_Sorting">
<Columns>
<asp:TemplateField HeaderText="Id" SortExpression="Id">
<ItemTemplate>
<asp:Label ID="lblId" runat="server" Text='<%# Bind("Id") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
<asp:BoundField DataField="Country" HeaderText="Country" SortExpression="Country" />
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>
Code
C#
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
DataTable dt = new DataTable();
dt.Columns.AddRange(new DataColumn[3] { new DataColumn("Id"), new DataColumn("Name"), new DataColumn("Country") });
dt.Rows.Add(1, "John Hammond", "United States");
dt.Rows.Add(2, "Mudassar Khan", "India");
dt.Rows.Add(3, "Suzanne Mathews", "France");
dt.Rows.Add(4, "Robert Schidner", "Russia");
GridView1.DataSource = dt;
GridView1.DataBind();
TableCell tableCell = GridView1.HeaderRow.Cells[0];
Image img = new Image();
img.ImageUrl = "~/Images/asc.png";
tableCell.Controls.Add(new LiteralControl(" "));
tableCell.Controls.Add(img);
ViewState["tables"] = dt;
}
}
protected void GridView1_Sorting(object sender, GridViewSortEventArgs e)
{
string SortDir = string.Empty;
DataTable dt = new DataTable();
dt = ViewState["tables"] as DataTable;
{
if (dir == SortDirection.Ascending)
{
dir = SortDirection.Descending;
SortDir = "Desc";
}
else
{
dir = SortDirection.Ascending;
SortDir = "Asc";
}
DataView sortedView = new DataView(dt);
sortedView.Sort = e.SortExpression + " " + SortDir;
GridView1.DataSource = sortedView;
GridView1.DataBind();
for (int i = 0; i < GridView1.Columns.Count; i++)
{
string lbText = ((LinkButton)GridView1.HeaderRow.Cells[i].Controls[0]).Text;
if (lbText == e.SortExpression)
{
TableCell tableCell = GridView1.HeaderRow.Cells[i];
Image img = new Image();
img.ImageUrl = (SortDir == "Asc") ? "~/Images/asc.png" : "~/Images/desc.png";
tableCell.Controls.Add(new LiteralControl(" "));
tableCell.Controls.Add(img);
}
}
}
}
public SortDirection dir
{
get
{
if (ViewState["dirState"] == null)
{
ViewState["dirState"] = SortDirection.Ascending;
}
return (SortDirection)ViewState["dirState"];
}
set
{
ViewState["dirState"] = value;
}
}
VB.Net
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
If Not IsPostBack Then
Dim dt As New DataTable()
dt.Columns.AddRange(New DataColumn(2) {New DataColumn("Id"), New DataColumn("Name"), New DataColumn("Country")})
dt.Rows.Add(1, "John Hammond", "United States")
dt.Rows.Add(2, "Mudassar Khan", "India")
dt.Rows.Add(3, "Suzanne Mathews", "France")
dt.Rows.Add(4, "Robert Schidner", "Russia")
GridView1.DataSource = dt
GridView1.DataBind()
Dim tableCell As TableCell = GridView1.HeaderRow.Cells(0)
Dim img As New Image()
img.ImageUrl = "~/Images/asc.png"
tableCell.Controls.Add(New LiteralControl(" "))
tableCell.Controls.Add(img)
ViewState("tables") = dt
End If
End Sub
Protected Sub GridView1_Sorting(sender As Object, e As GridViewSortEventArgs)
Dim SortDir As String = String.Empty
Dim dt As New DataTable()
dt = TryCast(ViewState("tables"), DataTable)
If True Then
If dir = SortDirection.Ascending Then
dir = SortDirection.Descending
SortDir = "Desc"
Else
dir = SortDirection.Ascending
SortDir = "Asc"
End If
Dim sortedView As New DataView(dt)
sortedView.Sort = Convert.ToString(e.SortExpression + " ") & SortDir
GridView1.DataSource = sortedView
GridView1.DataBind()
For i As Integer = 0 To GridView1.Columns.Count - 1
Dim lbText As String = DirectCast(GridView1.HeaderRow.Cells(i).Controls(0), LinkButton).Text
If lbText = e.SortExpression Then
Dim tableCell As TableCell = GridView1.HeaderRow.Cells(i)
Dim img As New Image()
img.ImageUrl = If((SortDir = "Asc"), "~/Images/asc.png", "~/Images/desc.png")
tableCell.Controls.Add(New LiteralControl(" "))
tableCell.Controls.Add(img)
End If
Next
End If
End Sub
Public Property dir() As SortDirection
Get
If ViewState("dirState") Is Nothing Then
ViewState("dirState") = SortDirection.Ascending
End If
Return DirectCast(ViewState("dirState"), SortDirection)
End Get
Set(value As SortDirection)
ViewState("dirState") = value
End Set
End Property
Screenshot
