Scott on Writing

Musings on technical writing...

Adding Up and Down Arrow Images to a Sortable GridView

Prior to ASP.NET 2.0, I wrote an article on 4Guys showing how to add up and down arrow images to a sortable DataGrid's column headers to visually depict the column and direction the grid was sorted by (read the article; see a live demo). In particular, my approach required the page developer to add a bit of code to the ASP.NET page's code-behind class that would enumerate the grid's columns and remove the up/down arrow <img> tag for columns that were not currently being sorted, and would add the appropriate <img> tag to the column the data was sorted by.

I recently updated this functionality for the GridView control, but rather than require that the page developer add code to the ASP.NET page, I instead created a custom server control that extended the GridView. This control automatically adds the up/down arrow image when the grid is sorted.

To check out this code and a demo application, and to learn more about the inner workings of this custom server control, be sure to read my latest 4Guys article: Extending the GridView to Include Sort Arrows.

posted on Tuesday, January 22, 2008 1:40 PM

Feedback

# re: Adding Up and Down Arrow Images to a Sortable GridView 2/5/2008 5:32 PM Scott Mitchell

I've updated this control, improving the means by which the sort arrows are added. I've also added two additional properties for customizing the appearance of the sort column's header cell. Read more at:
http://aspnet.4guysfromrolla.com/articles/020608-1.aspx

# re: Adding Up and Down Arrow Images to a Sortable GridView 2/13/2008 7:15 PM cxspan

This is great and just what I was looking for, thanks! One question though: what if (for whatever reason) you have two columns with the same sort expression?? Is there no way to reference the column being sorted by index rather than matching on the sort expression string?

# re: Adding Up and Down Arrow Images to a Sortable GridView 2/13/2008 7:20 PM cxspan

Sorry, I guess I should explain the problem too as it may not be obvious to some readers. If you have two columns with the same sort expression, and the *2nd* column is sorted, the code will apply the styles/arrows to the *1st* column instead, b/c it will be the first to match the sort expression when looping through the DataControlField's.

Thanks again!

Title:  
Name:  
Url:
Protected by Clearscreen.SharpHIPEnter the code you see:
Comments   

Add To Your Reader

My Links

Archives

Post Categories

 

I am a Microsoft MVP for ASP.NET.
I am an ASPInsider.
<May 2008>
SMTWTFS
27282930123
45678910
11121314151617
18192021222324
25262728293031
1234567

Comment Stats

DayTotal% of Total
Sunday 1866.8%
Monday 37913.9%
Tuesday 45316.7%
Wednesday 50418.5%
Thursday 53519.7%
Friday 49418.2%
Saturday 1666.1%
Total 2717100.0%

Hour1Total% of Total
12:00 AM 652.4%
1:00 AM 682.5%
2:00 AM 622.3%
3:00 AM 742.7%
4:00 AM 572.1%
5:00 AM 1033.8%
6:00 AM 1084.0%
7:00 AM 1585.8%
8:00 AM 1716.3%
9:00 AM 1475.4%
10:00 AM 1716.3%
11:00 AM 1816.7%
12:00 PM 1886.9%
1:00 PM 1696.2%
2:00 PM 1605.9%
3:00 PM 1324.9%
4:00 PM 1073.9%
5:00 PM 923.4%
6:00 PM 913.3%
7:00 PM 963.5%
8:00 PM 833.1%
9:00 PM 782.9%
10:00 PM 792.9%
11:00 PM 772.8%
Total 2717100.0%

Comments by Blog Entry Date/Time

Day Entry MadeAvg.Total
Sunday 5.54144
Monday 5.22339
Tuesday 4.28419
Wednesday 7.67637
Thursday 6.90607
Friday 5.48411
Saturday 5.33160
Total 5.842717

Hour1 Entry MadeAvg.Total
12:00 AM 5.0035
1:00 AM 1.002
5:00 AM 0.000
7:00 AM 7.0035
8:00 AM 5.35107
9:00 AM 6.32278
10:00 AM 6.47246
11:00 AM 4.41181
12:00 PM 6.88330
1:00 PM 3.00111
2:00 PM 5.41222
3:00 PM 8.64285
4:00 PM 4.0589
5:00 PM 5.92154
6:00 PM 4.52113
7:00 PM 9.67174
8:00 PM 9.80147
9:00 PM 5.05111
10:00 PM 5.4265
11:00 PM 4.5732
Total 5.842717

Learn More About Comment Stats
1 - All times GMT -8...


Blog Stats

Favorite Web Sites

My Books

My MSDN Articles