columns.groupable.sort Object
Sets the sort configuration when grouping.
Example - use a custom function to compare the groups
<div id="grid"></div>
<script>
$("#grid").kendoGrid({
dataSource: {
data: [
{ id: 1, name: "Salmon", category: "Seafood" },
{ id: 3, name: "Ice cream", category: "Desserts" },
{ id: 2, name: "Mackerel", category: "Seafood" },
{ id: 4, name: "Cake", category: "Desserts" },
{ id: 5, name: "Lemonade", category: "Beverages" },
{ id: 6, name: "Tea", category: "Beverages" },
{ id: 7, name: "Coffee", category: "Beverages" },
],
pageSize: 10
},
pageable: true,
height: 550,
groupable: true,
columns: [
{ field: "id", title: "Id", width: "120px" },
{ field: "name", title: "Name", width: "120px" },
{
field: "category",
title: "Category",
width: "120px",
groupable: {
sort: {
compare: function(a, b) {
if (a.items.length === b.items.length) {
return 0;
} else if (a.items.length > b.items.length) {
return 1;
} else {
return -1;
}
}
}
}
}
]
});
</script>