DevExtreme v23.1 is now available.

Explore our newest features/capabilities and share your thoughts with us.

Your search did not match any results.
Data Grid

Record Grouping

The DataGrid allows users to group data against a single column or multiple columns.

To group data, users can drag and drop column headers onto and from the area above the grid. This area is called the groupPanel. Set its visible property to true to show it.

Users can reorder headers within the groupPanel to change group hierarchy. To enable this functionality, set the allowColumnReordering property to "true".

To group data against a single column, apply the groupIndex property to it. This property accepts a zero-based index number that controls the column order. In this example, the data is grouped against the State column.

You can also use the grouping object to specify user interaction settings related to grouping. This demo illustrates the autoExpandAll property that specifies whether the groups appear expanded.

Thank you for your interest in our ASP.NET MVC product libraries and UI component suite. We are moving ASP.NET MVC-related demos and content to Please make sure to update your bookmarks with our new URL.

View Demo