Awesome ASP.net Core and MVC Controls

Grid grouping and aggregates


Person column:
Food column:

GridDemo/GroupingContent.cshtml
@model AwesomeMvcDemo.ViewModels.Input.GridDemoGroupingCfgInput

@(Html.Awe().Grid("GroupingGrid")
.Columns(new[]{
new Column{Bind = "Id", Width = 75},
new Column{Bind = "Person", Group = Model.PersonGrouped,
GroupRemovable = Model.PersonRem, Groupable = Model.PersonGroupable, GroupRank = Model.PersonRank},
new Column{Bind = "Food", Group = Model.FoodGrouped,
GroupRemovable = Model.FoodRem, Groupable = Model.FoodGroupable, GroupRank = Model.FoodRank},
new Column{Bind = "Date", Width = 180},
new Column{Bind = "Price", Width = 80},
new Column{Bind = "Location"},
new Column{Bind = "Chef.FirstName,Chef.LastName", ClientFormat = ".ChefName", Header = "Chef", FooterClientFormat = ".ChefCount"}
})
.Height(450)
.ShowGroupBar(Model.ShowGroupBar)
.Groupable(Model.Groupable)
.ShowGroupedColumn(Model.ShowGroupedColumn)
.Parameter("collapsed", Model.Collapsed)
.Url(Url.Action("GetItems","GroupingGrid")))
Demos/Grid/GroupingGridController.cs
public class GroupingGridController : Controller
{
public ActionResult GetItems(GridParams g, bool collapsed)
{
// passing 2 MakeFooter and MakeHeader to customize header and add footer
var builder = new GridModelBuilder<Lunch>(Db.Lunches.AsQueryable(), g)
{
KeyProp = o => o.Id,
Map = o => new
{
o.Id,
o.Person,
o.Food,
Date = o.Date.ToShortDateString(),
o.Price,
o.Location,
ChefName = o.Chef.FirstName + " " + o.Chef.LastName
},
MakeFooter = MakeFooter,
MakeHeader = gpinf => MakeHeader(gpinf, collapsed)
};

return Json(builder.Build());
}

private GroupHeader MakeHeader(GroupInfo<Lunch> g, bool collapsed)
{
// get first item in the group
var first = g.Items.First();

// get the grouped column value(s) for the first item
var val = string.Join(" ", AweUtil.GetColumnValue(g.Column, first).Select(ToStr));

return new GroupHeader
{
Content = string.Format(" {0} : {1} ( Count = {2}, Max Price = {3} )",
g.Header,
val,
g.Items.Count(),
g.Items.Max(o => o.Price)),
Collapsed = collapsed
};
}

private object MakeFooter(GroupInfo<Lunch> info)
{
// will add the word Total at the grid level footer (Level == 0)
var pref = info.Level == 0 ? "Total " : "";

return new
{
Food = pref + " count = " + info.Items.Count(),
Location = info.Items.Select(o => o.Location).Distinct().Count() + " distinct locations",
Date = pref + " max: " + info.Items.Max(o => o.Date).Date.ToShortDateString(),
Price = info.Items.Sum(o => o.Price),
ChefCount = info.Items.Select(o => o.Chef.Id).Distinct().Count() + " chefs"
};
}

private static string ToStr(object o)
{
return o is DateTime ? ((DateTime)o).ToShortDateString() : o.ToString();
}
}

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

  • Column.Group - defines initial column grouped state
  • Column.GroupRank - group rank for this column
  • Column.GroupRemovable - (default is true) if set to false grouped column won't have the remove group button
  • .ShowGroupedColumn - if true the grouped columns will be hidden
  • GridModelBuilder.MakeHeader - defines a function for creating the GroupHeader
  • GridModelBuilder.MakeFooter - function for creating a group footer



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.