DxDataGrid<T>.GroupSummary Property

Specifies the collection of group summary items.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v21.2.dll


public RenderFragment GroupSummary { get; set; }

Property Value

Type Description

A collection of items (UI fragment).


The Data Grid supports two summary types:

  • Total summaries are calculated across all grid rows and displayed in the grid’s footer.
  • Group summaries are calculated across rows in individual groups and displayed group rows.

Do the following to calculate a group summary:

  1. Add a DxDataGridSummaryItem object to the GroupSummary collection.
  2. Use the item’s SummaryType property to specify an aggregate function. The following functions are available: Sum, Min, Max, Avg, and Count.
  3. Set the Field property to the name of a data field whose values take part in calculations. The Min and Max functions require a numeric or date-time data field. The Avg and Sum functions work with numeric fields only. The Count function does not process any field values and does not require that you specify the Field property.

  4. Use the DisplayFormat property to format the summary value. The format pattern can include static text and the predefined placeholders: {0} returns the summary value and {1} returns the parent column’s caption.

    If you do not specify the DisplayFormat property, the following format is applied: {Summary function}: {summary value}. For example, Count: 100 and Sum: 1,000.

  5. Use the GroupSummaryPosition property to position the group summary. The following values are available:

<DxDataGrid Data="@Data" ShowGroupPanel="true">
        <DxDataGridColumn Field="@nameof(Invoice.Country)" GroupIndex="0" Width="200px" />
        <DxDataGridColumn Field="@nameof(Invoice.City)" GroupIndex="1" Width="200px" />
        <DxDataGridColumn Field="@nameof(Invoice.CustomerName)" />
        <DxDataGridSpinEditColumn Field="@nameof(Invoice.UnitPrice)" DisplayFormat="c" Width="120px" />
        <DxDataGridSpinEditColumn Field="@nameof(Invoice.Quantity)" Width="120px" />
        <DxDataGridSummaryItem SummaryType="SummaryItemType.Count" Field="@nameof(Invoice.CustomerName)" DisplayFormat="Count is {0}" />
        <DxDataGridSummaryItem SummaryType="SummaryItemType.Avg" Field="@nameof(Invoice.Quantity)" DisplayFormat="Avg of Quantity is {0:0.##}" />

Data Grid Group Summary Position

Run Demo: Data Grid - Group Summary

See Also