Skip to main content

DxSummaryItemBase<TModel>.DisplayFormat Property

Specifies the summary item’s display format.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue("")]
[Parameter]
public string DisplayFormat { get; set; }

Property Value

Type Default Description
String String.Empty

A string that specifies the display format. An empty string applies the predefined format string.

Remarks

To calculate a total or group summary in the Data Grid, add a DxDataGridSummaryItem object to the TotalSummary or GroupSummary collection. Use the item’s SummaryType property to specify an aggregate function to calculate.

All summary items have the following predefined display format: {Summary function}: {summary value}. For example, Count: 100 and Sum: 1,000.

Use the DisplayFormat property to apply a custom format to a summary item. The format pattern can include static text and the following placeholders:

  • {0} returns the summary value.
  • {1} returns the caption of the column whose values the summary aggregates. For instance, you can use this placeholder when you specify the ShowInColumn property to display the summary value under another column.
<DxDataGrid Data="@Orders">
    <Columns>
        <DxDataGridDateEditColumn Field="@nameof(Order.OrderDate)" Width="240px" />
        <DxDataGridComboBoxColumn Field="@nameof(Order.CountryId)"
                                  Caption="Ship Country"
                                  Data="@Countries"
                                  ValueFieldName="@nameof(Country.Id)"
                                  TextFieldName="@nameof(Country.CountryName)"
                                  FilteringMode="DataGridFilteringMode.Contains"
                                  Width="250px" />
        <DxDataGridColumn Field="@nameof(Order.Product)" />
        <DxDataGridSpinEditColumn Field="@nameof(Order.UnitPrice)"
                                  DisplayFormat="c"
                                  Width="120px" />
    </Columns>
    <TotalSummary>
        <DxDataGridSummaryItem Field=@nameof(Order.OrderDate)
                               SummaryType=SummaryItemType.Min
                               DisplayFormat="First: {0:D}" />
        <DxDataGridSummaryItem Field=@nameof(Order.UnitPrice)
                               SummaryType=SummaryItemType.Sum
                               DisplayFormat="Sum: {0:c}" />
        <DxDataGridSummaryItem ShowInColumn=@nameof(Order.CountryId)
                               SummaryType=SummaryItemType.Count />
   </TotalSummary>
</DxDataGrid>

Data Grid Total Summary

Run Demo: Data Grid - Summary

See Also