ASP.NET MVC 3 Razor WebGrid tooltip and sorting marker

I have developed a webapplication in ASP.NET MVC 3 Razor. I´ve bee using a WebGrid to list tabular data and 开发者_运维知识库would like to do xxx things with the webgrid.

1. I would like for the WebGrid to show which column is the sorting column and if it is sorting ascending or descending. I can´t find any property of the WebGrid that seems to handle my wishes. And i cant find anything on the internet...

2. I would like to add a tooltip to all the column headers (different tooltip for each header). Obviously there are loads of javascript tooltips out there but i haven´t found anything that i can use in the WebGrid...

For q2: Give your WebGrid helper an ID

htmlAttributes:new{id="GridID"}

Then with Jquery put title for all headers $('table#GridID th').each(function() { $(this).attr('title', $(this).text()); });

For the sorting thingy you can take a look at this post:

Sort indicator in System.Web.Helpers.WebGrid

In the view you can do this:

// Force a descending sort only when no user specified sort is present
if (Request.QueryString[grid.SortDirectionFieldName].IsEmpty())
{
    grid.SortDirection = SortDirection.Descending;
}

and then a custom JavaScript:

displaySortIndicators('@grid.SortColumn', '@grid.SortDirection');

displaySortIndicators = function (column, sortDirection) {

    if (column != '') {

        var th = $('thead > tr > th > a[href*="sort=' + column + '"]');

        th.append((sortDirection == 'Ascending') ? "▲" : "▼");
    }
}

For the tooltip thingy, you can use qTip2.

NOTE: I use both approaches from links above with the WebGrid helper and they work as expected.