Setting the default grouping in Kendo Grid
Asked Answered
L

1

9

I have a requirement to group a grid by default on a particular column and to not allow the user to remove the grouping on that column. Is this possible?

Lovieloving answered 24/6, 2014 at 15:27 Comment(0)
B
24

You can set an initial grouping when you create the grid. You can keep the users from being able to remove or change the grouping by setting the groupable property to false or simply not including it in the configuration.

Both of the examples below group the grid based on FirstName.

Razor HTML Example:

@(Html.Kendo().Grid(Model.Person)
    .Name("grid")
    .Columns(columns =>
    {
      columns.Bound(model => model.FirstName);
      columns.Bound(item => item.LastName);
    })
    .Groupable(g => g.Enabled(false))
    .DataSource(dataSource => dataSource
        .Server()
        .Group(groups => groups.Add(p => p.FirstName))
)

JavaScript Example:

$("#grid").kendoGrid({
    dataSource: {
        data: [{FirstName: "FirstName1", LastName: "LastName1"},
              {FirstName: "FirstName1", LastName: "LastName2"},
              {FirstName: "FirstName3", LastName: "LastName3"},
              {FirstName: "FirstName1", LastName: "LastName4"}],
        group: { field: "FirstName" } // set grouping for the dataSource
    },
    groupable: false, // this will remove the group bar
    sortable: true,
    columns: ["FirstName","LastName"]
});

Link to a fiddle for the JavaScript example.

Source of the JavaScript example

Bidle answered 19/12, 2014 at 22:39 Comment(2)
how about sort able and group able together?Cressler
@sabertabatabaeeyazdi If you mean how to make the grid both sortable and groubable, simply set both those properties to true.Bidle

© 2022 - 2024 — McMap. All rights reserved.