Skip to main content

DxGridColumn.FooterTemplate Property

Specifies a template used to display the column’s footer cell.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

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

Property Value

Type Description
RenderFragment<GridColumnFooterTemplateContext>

The template for the column’s footer.

Remarks

The FooterTemplate allows you to specify custom content and appearance for the footer cell displayed in this column. To define a common template for all footer cells in the Grid, use the DxGrid.ColumnFooterTemplate.

The FooterTemplate 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 summary values bold for the UnitPrice column.

@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">
            <FooterTemplate>
                @{
                    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/>
                        }
                    }
                }
            </FooterTemplate>
        </DxGridDataColumn>
        <DxGridDataColumn FieldName="Quantity" />
    </Columns>
    <TotalSummary>
        <DxGridSummaryItem SummaryType="GridSummaryItemType.Max" FieldName="UnitPrice" />
        <DxGridSummaryItem SummaryType="GridSummaryItemType.Min" FieldName="UnitPrice" />
        <DxGridSummaryItem SummaryType="GridSummaryItemType.Count" FieldName="Quantity" />
    </TotalSummary>
</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 Footer Template

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

Implements

See Also