Blazor DataGrid Example - Default Aggregation
This sample demonstrates the DataGrid's built-in aggregate functionality by displaying the footer aggregate value in the Freight column.
Customer ID | Freight | Order Date | Ship Country |
|---|
| ALFKI | $2.30 | 5/15/1991 | Denmark |
| ANATR | $3.30 | 4/4/1990 | Brazil |
| ANTON | $4.30 | 11/30/1957 | Germany |
| BLONP | $5.30 | 10/22/1930 | Austria |
| BOLID | $6.30 | 2/18/1953 | Switzerland |
| ALFKI | $4.60 | 5/15/1991 | Denmark |
| ANATR | $6.60 | 4/4/1990 | Brazil |
| ANTON | $8.60 | 11/30/1957 | Germany |
| BLONP | $10.60 | 10/22/1930 | Austria |
| BOLID | $12.60 | 2/18/1953 | Switzerland |
| ALFKI | $6.90 | 5/15/1991 | Denmark |
| ANATR | $9.90 | 4/4/1990 | Brazil |
Aggregates are supported by the Blazor DataGrid and will be displayed in the footer, group footer, and group caption. The GridAggregates component can be used to provide aggregate configurations.
The built-in aggregates are as follows:
- Sum
- Average
- Min
- Max
- Count
- TrueCount
- FalseCount
In this demo, the FooterTemplate is used to display two different aggregates in the DataGrid footer.
The Sum aggregate type value is shown in the Freight column in the first aggregate row. To accomplish this, you must define Type and Field property values as Freight, which will be used to perform the aggregation. Inside the
FooterTemplate, the sum value is accessed via itsTypename SumValue.Sum, where SumValue is an implicit named parameter - Context. Before being displayed, theSumvalue will be formatted according to its Format value(C2).The Average aggregate type value is shown in the Freight column in the second aggregate row. To accomplish this, you must define
TypeandFieldproperty value as Freight, which will be used to perform the aggregation. Inside theFooterTemplate, the aggregate value is accessed via itsTypename (AverageValue.Average), where AverageValue is an implicit named parameter - Context. Before being displayed, theAveragevalue will be formatted according to itsFormatvalue(C2).
More information about the Aggregates can be found in this documentation section.