Skip to main content

DxGrid.ColumnFooterTemplate Property

Specifies a common template used to display all footer cells in the Grid.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public RenderFragment<GridColumnFooterTemplateContext> ColumnFooterTemplate { get; set; }

Property Value

Type Description
RenderFragment<GridColumnFooterTemplateContext>

The template for all footer cells.

Remarks

The ColumnFooterTemplate allows you to specify custom content and appearance for all footer cells displayed in the Grid. To define a template for individual footer cells, use the DxGridColumn.FooterTemplate.

The ColumnFooterTemplate accepts a GridColumnFooterTemplateContext object as the context parameter. You can use the parameter’s members to get the SummaryItems, and the Column or DataColumn object. You can also access the Grid object and use its members to obtain additional information about the Grid (for instance, information about summary items).

The following code snippet makes all summary values bold.

@using Microsoft.EntityFrameworkCore
@inject IDbContextFactory<NorthwindContext> NorthwindContextFactory
@implements IDisposable

<DxGrid Data="@Data">
    <Columns>
        <DxGridDataColumn FieldName="Country" />
        <DxGridDataColumn FieldName="City" />
        <DxGridDataColumn FieldName="OrderDate" />
        <DxGridDataColumn FieldName="UnitPrice" DisplayFormat="c" Width="150px" />
        <DxGridDataColumn FieldName="Quantity" />
    </Columns>
    <TotalSummary>
        <DxGridSummaryItem SummaryType="GridSummaryItemType.Max" FieldName="UnitPrice" />
        <DxGridSummaryItem SummaryType="GridSummaryItemType.Min" FieldName="UnitPrice" />
        <DxGridSummaryItem SummaryType="GridSummaryItemType.Count" FieldName="Quantity" />
    </TotalSummary>
    <ColumnFooterTemplate>
        @{
            var summaryItems = context.SummaryItems;
            if (summaryItems.Any()) {
                foreach (var i in summaryItems) {
                    @context.Grid.GetTotalSummaryLabel(i)
                    <text>: </text>
                    <b>@context.Grid.GetTotalSummaryFormattedValue(i)</b> <br/>
                }
            }
        }
    </ColumnFooterTemplate>
</DxGrid>

@code {
    object Data { get; set; }
    NorthwindContext Northwind { get; set; }

    protected override void OnInitialized() {
        Northwind = NorthwindContextFactory.CreateDbContext();
        Data = Northwind.Invoices
            .ToList();
    }

    public void Dispose() {
        Northwind?.Dispose();
    }
}

Blazor Grid Column Footer Template

For more information about templates in the Grid component, refer to the following topic: Templates in Blazor Grid.

See Also