DevExtreme v23.1 is now available.

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

Free Trial Buy

grouping

Configures grouping.

Type:

Object

View Demo

See Also

allowCollapsing

Specifies whether the user can collapse grouped records in a grid or not.

Type:

Boolean

Default Value: true

See Also

autoExpandAll

Specifies whether groups appear expanded or not.

Type:

Boolean

Default Value: true

NOTE
Setting this option to false forces DataGrid to load data for all pages at once. It may be unnoticeable if you use a local data source, but in case of remote data sources, it is undesirable. To avoid the unnecessary loading of data, implement remote grouping.
See Also

contextMenuEnabled

Enables the user to group data using the context menu.

Type:

Boolean

Default Value: false

Set this option to true to enable grouping using the context menu. In this case, to group/ungroup data, the user right-clicks a column header and chooses the required item from the appeared context menu.

Watch Video

See Also

expandMode

Specifies the event on which a group will be expanded/collapsed.

Type:

String

Default Value: 'buttonClick', 'rowClick' (mobile devices)
Accepted Values: 'buttonClick' | 'rowClick'

By default, to expand/collapse a group, the user clicks its expand/collapse button. On small-screen devices, this approach may impair the user experience. As an alternative, consider expanding/collapsing a group by a click on the group row. For this purpose, assign "rowClick" to the grouping.expandMode option.

Use the GridGroupingExpandMode enum to specify this option when the widget is used as an ASP.NET MVC Control. This enum accepts the following values: ButtonClick and RowClick.

See Also

texts

Defines the texts of grouping-related visual elements.

Type:

Object

Use the options of this object to localize or customize grouping-related elements. For example, the groupByThisColumn, ungroup and ungroupAll options customize items of the context menu. These items appear in the menu only if the grouping.contextMenuEnabled option is set to true.

Also, this object contains the groupContinuesMessage and groupContinuedMessage options that specify the text added to group rows when the group is parted.