jQuery DataGrid - grouping

View Demo

See Also

• Grouping

See Also

• Expand and Collapse Groups - User Interaction

See Also

• Expand and Collapse Groups - User Interaction
• Expand and Collapse Groups - API

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.

See Also

• Grouping
• groupPanel.visible - enables the user to group data using the group panel.
• columns[].allowGrouping - disallows grouping for an individual column.
• grouping.texts - customizes the context menu items.

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 5 Control or a DevExtreme-Based ASP.NET Core Control. This enum accepts the following values: ButtonClick and RowClick.

See Also

• Expand and Collapse Groups - User Interaction

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.