Header Bands

 
Drag a column header here to group by that column
Salesperson Order
Company Name Date Product Quantity
Name Unit Price
Steven Buchanan Vins et alcools Chevalier 7/4/2014 Queso Cabrales $14.00 12
Steven Buchanan Vins et alcools Chevalier 7/4/2014 Singaporean Hokkien Fried Mee $10.00 10
Steven Buchanan Vins et alcools Chevalier 7/4/2014 Mozzarella di Giovanni $35.00 5
Michael Suyama Toms Spezialitäten 7/5/2014 Tofu $19.00 9
Michael Suyama Toms Spezialitäten 7/5/2014 Manjimup Dried Apples $42.00 40
Margaret Peacock Hanari Carnes 7/8/2014 Jack's New England Clam Chowder $8.00 10
Margaret Peacock Hanari Carnes 7/8/2014 Manjimup Dried Apples $42.00 35
Margaret Peacock Hanari Carnes 7/8/2014 Louisiana Fiery Hot Pepper Sauce $17.00 15
Janet Leverling Victuailles en stock 7/8/2014 Gustaf's Knäckebröd $17.00 6
Janet Leverling Victuailles en stock 7/8/2014 Ravioli Angelo $16.00 15
Janet Leverling Victuailles en stock 7/8/2014 Louisiana Fiery Hot Pepper Sauce $17.00 20
Margaret Peacock Suprêmes délices 7/9/2014 Sir Rodney's Marmalade $65.00 40
Margaret Peacock Suprêmes délices 7/9/2014 Geitost $2.00 25
Margaret Peacock Suprêmes délices 7/9/2014 Camembert Pierrot $27.00 40
Janet Leverling Hanari Carnes 7/10/2014 Gorgonzola Telino $10.00 20
Janet Leverling Hanari Carnes 7/10/2014 Chartreuse verte $14.00 42
Janet Leverling Hanari Carnes 7/10/2014 Maxilaku $16.00 40
Steven Buchanan Chop-suey Chinese 7/11/2014 Guaraná Fantástica $4.00 15
Steven Buchanan Chop-suey Chinese 7/11/2014 Pâté chinois $19.00 21
Steven Buchanan Chop-suey Chinese 7/11/2014 Longlife Tofu $8.00 21
Data grid with 2155 rows and 8 columns

You can combine DevExpress Blazor Grid headers into a hierarchy of higher-level groups (header bands). To address a broad range of usage scenarios, our Blazor Grid component supports unlimited nesting levels for bands displayed within the component. Users can use the column chooser or drag column headers to move columns within a band but cannot drag them out.

To create a band, declare a DxGridBandColumn object and specify nested columns in the Columns template.

This demo uses Order and Product header bands to form a three-level hierarchy.