Multi column grouping in Kendo Grid
Solution 1
You need to set the group option of the grid's data source as array. Here is some sample code:
<div id="grid"></div>
<script>
var dataSource = new kendo.data.DataSource({
data: [
{ name: "Pork", category: "Food", subcategory: "Meat" },
{ name: "Pepper", category: "Food", subcategory: "Vegetables" },
{ name: "Beef", category: "Food", subcategory: "Meat" }
],
group: [
// group by "category" and then by "subcategory"
{ field: "category" },
{ field: "subcategory" },
]
});
$("#grid").kendoGrid({
dataSource: dataSource
});
</script>
Here is a live demo: http://dojo.telerik.com/@korchev/OBAva
Solution 2
Because it was asked, and is implied in the question title: it is possible to group "together" and not hierarchically. It requires a change to the data model so that all the grouping columns are held together in a single object.
In the datasource, the model and grouping configuration might look like
data: [
{ name: "Pork", cat_group: { category: "Food", subcategory: "Meat" } },
{ name: "Pepper", cat_group: { category: "Food", subcategory: "Vegetables" } },
{ name: "Beef", cat_group: { category: "Food", subcategory: "Meat" } }
],
group: [
// group by "category" and "subcategory" together
{ field: "cat_group" },
]
UPDATE for MVC integration:
If this is being done with serialized objects in ASP.NET MVC using an AJAX datasource, note that the grouping object must have value semantics (overriding Equals
and implementing ==
/!=
) as well as implementing IComparable
.
Nupur
Updated on June 19, 2022Comments
-
Nupur about 2 years
I am using kendo grid to display a set of records. But now I want to use Aggregates property to group columns and perform certain aggregate function on columns.
As per the below documentation,I can apply grouping on a single column,but I want to do grouping on multi column http://demos.telerik.com/kendo-ui/grid/aggregates
Please suggest how can I acheive it.
Thanks
-
Nupur almost 9 yearsThanks alot!! This is just perfect and works really well
-
flap13 over 7 yearsHi. Is it possible group together, not "then"? Thanks
-
SharpC over 5 yearsGreat MVC tip thanks!! The last part of the MVC is very important in the case of columns that are class objects. Although remember to not use
==
within the override of==
otherwise you get infinite recursion! stackoverflow.com/questions/4219261/… So you need something like this: stackoverflow.com/questions/25461585/…