DataGrid / Grouping / Grouping

Blazor DataGrid Example - Row Grouping

Loading Syncfusion Blazor Server Demos…

Customer ID
1 of 6 pages (70 items)

This sample demonstrates the DataGrid grouping feature for organizing and hierarchically displaying records.

The Blazor DataGrid supports record grouping based on specified columns. When grouping is enabled, records are organized hierarchically, allowing users to expand and collapse grouped data. To enable grouping, set the AllowGrouping property to true.

In this demo:

  • The DataGrid is initially grouped by the Customer ID column
  • Columns can be grouped by dragging and dropping column headers into the group drop area
  • The PersistGroupState option maintains the expand or collapse state during paging, sorting, or filtering

To enable group state persistence across operations, set the PersistGroupState property to true. By default, this property is set to false.

For more detailed information about grouping, refer to the grouping documentation.

Transform your Blazor web apps today with Syncfusion® Blazor components
145+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE