Sorting


Person column:
Food column:

GridDemo/SortingContent.cshtml
@model AwesomeMvcDemo.ViewModels.Input.GridDemoSortingCfgInput

@(Html.Awe().Grid("SortingGrid")
.Columns(new[]{
new Column{Bind = "Id", Width = 55},
new Column{Bind = "Person", PercentWidth = 18,
Sortable = Model.PersonSortable, SortRank = Model.PersonRank, Sort = Model.PersonSort},
new Column{Bind = "Food", PercentWidth = 18,
Sortable = Model.FoodSortable, SortRank = Model.FoodRank, Sort = Model.FoodSort},
new Column{Bind = "Date", Width = 100},
new Column{Bind = "Price", Width = 80, ClientFormat = ".PriceĀ£"},
new Column{Bind = "Location", Width = 150}
})
.Height(350)
.SingleColumnSort(Model.SingleColumnSort)
.Sortable(Model.Sortable)
.Url(Url.Action("GetItems","LunchGrid")))
Awesome/Grid/LunchGridController.cs
public class LunchGridController : Controller
{
public ActionResult GetItems(GridParams g, string person, string food, int? country)
{
food = (food ?? "").ToLower();
person = (person ?? "").ToLower();

var list = Db.Lunches
.Where(o => o.Food.ToLower().Contains(food) && o.Person.ToLower().Contains(person))
.AsQueryable();

if (country.HasValue) list = list.Where(o => o.Country.Id == country);

return Json(new GridModelBuilder<Lunch>(list, g)
{
KeyProp = o => o.Id,// needed for Entity Framework | nesting | tree | api
Map = o => new
{
o.Id,
o.Person,
o.Food,
o.Location,
o.Price,
Date = o.Date.ToShortDateString(),
CountryName = o.Country.Name,
ChefName = o.Chef.FirstName + " " + o.Chef.LastName
}
}.Build());
}
}

Sorting can be enabled or disabled for the whole grid by using the .Sortable(bool) and can be set for each column by setting the Column.Sortable

  • SingleColumnSort - enables sorting by one column at a time
  • Column.Sort - initial sorting for this column (None | Asc | Desc)
  • Column.SortRank - initial sort rank for this column