Ordernar, filtrar y pagineo (MVC)

Para este ejemplo usaremos la tabla products de la base de datos northwind y ya debemos de tener su controlador y las vistas del mismo.  (Ver ejemplo anterior)

Código inicial del contraldor:

public ViewResult Index() 
{ 
    var products = db.Products.Include(p => p.Categories).Include(p => p.Suppliers);
    return View(products.ToList()); 
}

Código inicial de la vista:

<table> 
    <tr> 
        <th> 
            ProductName 
        </th> 
        <th> 
            Suppliers 
        </th> 
        <th> 
            Categories 
        </th> 
        <th> 
            UnitPrice 
        </th> 
        <th> 
            UnitsInStock 
        </th> 
        <th> 
            Discontinued 
        </th> 
        <th></th> 
    </tr>

Sort:
En este ejemplo agregaremos al controlador.

public ViewResult Index(string sortOrder)
{ 
  ViewBag.NameSortParm = String.IsNullOrEmpty(sortOrder) ? "ProductName desc" : ""; 
  ViewBag.UnitPriceSortParm = sortOrder == "UnitPrice" ? "UnitPrice desc" : "UnitPrice"; 

  var products = db.Products.Include(p => p.Categories).Include(p => p.Suppliers);

   switch (sortOrder) 
   { 
   case "ProductName desc": 
       products = products.OrderByDescending(s => s.ProductName); 
       break; 
   case "UnitPrice": 
       products = products.OrderBy(s => s.UnitPrice); 
       break; 
   case "UnitPrice desc": 
        products = products.OrderByDescending(s => s.UnitPrice); 
        break; 
   default: 
        products = products.OrderBy(s => s.ProductName); 
        break; 
    } 
   return View(products.ToList()); 
}

En la vista cambiaremos los header por links los cuales enviaran el orden necesario:

<table> 
    <tr> 
        <th>             
 @Html.ActionLink("Product Name", "Index", new { sortOrder = ViewBag.NameSortParm }) 
        </th> 
        <th> 
            Suppliers 
        </th> 
        <th> 
            Categories 
        </th> 
        <th> 
@Html.ActionLink("UnitPrice", "Index", new { sortOrder = ViewBag.UnitPriceSortParm }) 
        </th> 
        <th> 
            UnitsInStock 
        </th> 
        <th> 
            Discontinued 
        </th> 
        <th></th> 
    </tr>

Resultado:



Filtros:
En este ejemplo agregaremos al controlador.

public ViewResult Index(string sortOrder, string searchString)

{ 
  ViewBag.NameSortParm = String.IsNullOrEmpty(sortOrder) ? "ProductName desc" : ""; 
  ViewBag.UnitPriceSortParm = sortOrder == "UnitPrice" ? "UnitPrice desc" : "UnitPrice"; 
  

  ViewBag.SearchString = searchString;

  var products = db.Products.Include(p => p.Categories).Include(p => p.Suppliers);

if (!String.IsNullOrEmpty(searchString)) 
{ 
  products = products.Where(s => s.ProductName.ToUpper().Contains(searchString.ToUpper()));
                                        
} 

   switch (sortOrder) 
   { 
   case "ProductName desc": 
       products = products.OrderByDescending(s => s.ProductName); 
       break; 
   case "UnitPrice": 
       products = products.OrderBy(s => s.UnitPrice); 
       break; 
   case "UnitPrice desc": 
        products = products.OrderByDescending(s => s.UnitPrice); 
        break; 
   default: 
        products = products.OrderBy(s => s.ProductName); 
        break; 
    } 
   return View(products.ToList()); 
}

En la vista agregaremos un textbox necesario para buscar los productos:

<p> 
    @Html.ActionLink("Create New", "Create") 

    @using (Html.BeginForm()) 
    { 
        <p> 
            Product Name: @Html.TextBox("SearchString") &nbsp; 
            <input type="submit" value="Search" /></p> 
    } 

</p>

En la vista también debemos de cambiar los action link para conservar el valor del searchString.

 @Html.ActionLink("Product Name", "Index", new { sortOrder = ViewBag.NameSortParm, 
                SearchString = ViewBag.SearchString }) 

@Html.ActionLink("UnitPrice", "Index", new { sortOrder = ViewBag.UnitPriceSortParm,                     SearchString = ViewBag.SearchString })

Resultado: