Awesome ASP.net Core and MVC Controls

Grid sorting


Person column:
Food column:

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

@(Html.Awe().Grid("SortingGrid")
.Columns(
new Column{Bind = "Id", Width = 75},
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.FoodPic,
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



Comments

We use cookies to improve your online experience. By accessing this site, you agree to the use of cookies and other technologies to process your personal data (e.g. IP address) to enhance and personalise your experience across our websites. Additionally, third-party companies, may store cookies on your device and use similar technologies to collect and use certain information. For more information, refer to our privacy policy and cookie policy.