You can take a Image Field in your grid view header temple.On Sorting action you can access the header row,From that header row u can get the Image Field ID and as per your sorting direction,u can change the image.
Debabrata Pattanaik
Marked as answer by ashok.k on Apr 20, 2009 06:17 AM
I have a code snippet I saved sometime ago and it works like a charm. Not sure why an image is not a property field in the .net 3.5 but hopefully they will add it later on. Add this snippet in your code behind and just change the GridView's name as well
as the location and name of the image you want to use.
Private Sub GridView1_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowCreated
GridViewSortImages(sender, e)
End Sub
Sub GridViewSortImages(ByVal sender As Object, ByVal e As GridViewRowEventArgs)
Dim senderGridView As GridView = CType(sender, GridView)
If Not (e.Row Is Nothing) AndAlso e.Row.RowType = DataControlRowType.Header Then
For Each cell As TableCell In e.Row.Cells
If cell.HasControls Then
Dim button As LinkButton = CType((cell.Controls(0)), LinkButton)
If Not (button Is Nothing) Then
Dim image As New System.Web.UI.WebControls.Image
image.ImageUrl = "~/images/1x1.gif"
If senderGridView.SortExpression = button.CommandArgument Then
If senderGridView.SortDirection = SortDirection.Ascending Then
image.ImageUrl = "~/images/ascending.gif"
Else
image.ImageUrl = "~/images/descending.gif"
End If
End If
cell.Controls.Add(image)
End If
End If
Next
End If
End Sub
Remember to mark as answer if this post answered or solved your problem.
Marked as answer by ashok.k on Apr 20, 2009 06:17 AM
Set a CSS style based on the sort direction and supply a different CSS background-image with CSS background image positioning. That way, both the link text and the image are clickable.
If you supply a link and a separate image, then the image must be a separate clickable image. You will need to supply the correct command args for the sort to work once the image is clicked.
Please mark this post as the answer if you found it useful.
Cheers
Paul
Marked as answer by ashok.k on Apr 20, 2009 06:17 AM
ashok.k
Member
94 Points
150 Posts
Sort Indicator in Gridview header
Apr 18, 2009 11:14 AM|LINK
Hi
I am sorting the data in the GridView when the user clicks the Column header.
I want to display a SortIndicatior in the Column header.
I want to show UP or DOWN arrow next to the text in the column header of the sorted column.
How to display an image in the GridView Header next to the Header text?
Thanks
Ashok
pattanaik123
Member
159 Points
222 Posts
Re: Sort Indicator in Gridview header
Apr 18, 2009 11:40 AM|LINK
mo meng
Contributor
6700 Points
1351 Posts
Re: Sort Indicator in Gridview header
Apr 18, 2009 01:23 PM|LINK
add the following css
.sorticon
{
font-family: Webdings;
font-size: x-small;
color: #DDB86D;
}
in the gridview rowcreated, add the following control to the header
Dim lblSorted As New LabellblSorted.CssClass =
"sorticon"lblSorted.Text = IIf(
"change the code here to determine whether the column is currently in acs/desc" = "ASC", "5", "6").ToStringe.Item.Cells(i).Controls.Add(lblSorted)
b471code3
Star
13877 Points
2598 Posts
Re: Sort Indicator in Gridview header
Apr 19, 2009 04:09 AM|LINK
I have a code snippet I saved sometime ago and it works like a charm. Not sure why an image is not a property field in the .net 3.5 but hopefully they will add it later on. Add this snippet in your code behind and just change the GridView's name as well as the location and name of the image you want to use.
Private Sub GridView1_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView1.RowCreated GridViewSortImages(sender, e) End Sub Sub GridViewSortImages(ByVal sender As Object, ByVal e As GridViewRowEventArgs) Dim senderGridView As GridView = CType(sender, GridView) If Not (e.Row Is Nothing) AndAlso e.Row.RowType = DataControlRowType.Header Then For Each cell As TableCell In e.Row.Cells If cell.HasControls Then Dim button As LinkButton = CType((cell.Controls(0)), LinkButton) If Not (button Is Nothing) Then Dim image As New System.Web.UI.WebControls.Image image.ImageUrl = "~/images/1x1.gif" If senderGridView.SortExpression = button.CommandArgument Then If senderGridView.SortDirection = SortDirection.Ascending Then image.ImageUrl = "~/images/ascending.gif" Else image.ImageUrl = "~/images/descending.gif" End If End If cell.Controls.Add(image) End If End If Next End If End SubPaul W Johns...
Participant
990 Points
168 Posts
Re: Sort Indicator in Gridview header
Apr 19, 2009 05:55 AM|LINK
Set a CSS style based on the sort direction and supply a different CSS background-image with CSS background image positioning. That way, both the link text and the image are clickable.
If you supply a link and a separate image, then the image must be a separate clickable image. You will need to supply the correct command args for the sort to work once the image is clicked.
Cheers
Paul
anup1252000
Contributor
3834 Points
698 Posts
Re: Sort Indicator in Gridview header
Apr 19, 2009 08:57 AM|LINK
protected void grdMovies_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.Header)
{
foreach (TableCell cell in e.Row.Cells)
{
LinkButton sortLink = (LinkButton)cell.Controls[0];
if (sortLink.Text == grdMovies.SortExpression)
{
if (grdMovies.SortDirection == SortDirection.Ascending)
sortLink.Text += “ <img src=’asc.gif’ title=
’Sort ascending’ />”;
else
sortLink.Text += “ <img src=’desc.gif’ title=
’Sort descending’ />”;
}
}
}
}
this wil help u..
Anup Hosur
HP
http://anup-anuphosur.blogspot.com/
shankel9760
Member
2 Points
1 Post
Re: Sort Indicator in Gridview header
Apr 21, 2009 04:26 PM|LINK