This project is read-only.
Project Description
I’ve created some sample code to show you how to add sorting and a pager to a paged list table. I’ve taken the DEPOT example of Scott Hanselman and added my code for sorting and the pager to the product list table. I hope Scott doesn’t mind, I extended his project a little bit. This is abandon ware and may be used in the same way as the original Project.


Sorting
The sorting for the table is done via the dynamic Linq class from the Linq examples. It’s added to the project as Helper/Dynamic.cs. This allows us to write a sort method in the controller. The sort method only sets a variable in the session data. It Then calls the standard List method. The List method checks to see if the variable is set and calls the OrderBy method from the dynamic Linq class. It’s the paginated by the ToPagedList class (also found in the helper folder). Now all we have to do is to replace each column header with an anchor tag.

public void Sort( string columnName )
{
this.HttpContext.Session.Add( "Product_SortColumn", columnName );
List(null);
}

public void List(int? page)
{
string sortColumn = this.HttpContext.Session["Product_SortColumn"] as string;
if( sortColumn != null)
{
var foo = ( from p in db.Products select p ).OrderBy(sortColumn );
viewData.Products = foo.ToPagedList( page ?? 0 );
}
else
{
var foo = ( from p in db.Products select p );
viewData.Products = foo.ToPagedList( page ?? 0 );
}

RenderView("List", viewData);
}

Pager
The pager depends on the ToPageList class for it’s data. This means we need to create a HTML control at parse time, just like the other HTML tags in the HTML class. I have split the creation into two parts, a method and a class. The method creates the class and returns the HTML tags as string.
The pager itself is a table, with previous, next and 5 page fields. Each page field (except the current) is an anchor tag. The correct URL location is created by replacing -1 in the single URL given to the method. Not the most pretty of solutions, but workable.

The code is placed in MyUI folder. No we can add the pagination is two lines.
1) Import the namespace
<%@ Import Namespace="Depot.MyUI" %>

2) Add the page navigator (use -1 as a placeholder for the actual page). The first to parameters are needed to build the URL. PageCount en PageIndex are the pages ( max and current). “PageNavigation” is the CSS class to style the appearance.
<%=MyUIHelper.PageNavigator<ProductController>( Html.ViewContext, c => c.List( -1 ), ViewData.Products.PageCount, ViewData.Products.PageIndex, "PageNavigation" ) %>

Last edited Mar 26, 2008 at 12:06 AM by avheerwaarde, version 2