Skip to main content
All docs
V24.2

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

DxTreeListColumn.FooterTemplate Property

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

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

#Property Value

Type Description
RenderFragment<TreeListColumnFooterTemplateContext>

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 TreeList, use the DxTreeList.ColumnFooterTemplate.

The FooterTemplate accepts a TreeListColumnFooterTemplateContext 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 TreeList object and use its members to obtain additional information about the TreeList (for instance, information about summary items).

The following code snippet customizes the Progress column’s footer. The footer contains the summary’s display text that is formatted in italics.

@inject EmployeeTaskService EmployeeTaskService

<DxTreeList Data="TreeListData" KeyFieldName="Id" ParentKeyFieldName="ParentId">
    <Columns>
        <DxTreeListDataColumn FieldName="Name" Caption="Task" />
        <DxTreeListDataColumn FieldName="EmployeeName" />
        <DxTreeListDataColumn FieldName="StartDate" />
        <DxTreeListDataColumn FieldName="DueDate" />
        <DxTreeListDataColumn FieldName="Status" Caption="Progress" DisplayFormat="p0" >
            <FooterTemplate>
                @{
                    var summaryItems = context.TreeList.GetTotalSummaryItems();
                    if (summaryItems.Any()) {
                        foreach (var i in summaryItems) {
                            <i>@context.TreeList.GetTotalSummaryDisplayText(i)</i>
                        }
                    }
                }
            </FooterTemplate>
        </DxTreeListDataColumn>
    </Columns>
    <TotalSummary>
        <DxTreeListSummaryItem FieldName="Status" SummaryType="TreeListSummaryItemType.Avg" />
    </TotalSummary>
</DxTreeList>

@code {
    List<EmployeeTask> TreeListData { get; set; }

    protected override void OnInitialized() {
        TreeListData = EmployeeTaskService.GenerateData();
    }
}

DevExpress Blazor TreeList - Total Summary

For more information about summaries in the TreeList component, refer to the following topic: Summary in Blazor TreeList.

#Implements

See Also