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

DxTreeListSelectionColumn.CellDisplayTemplate Property

Specifies a template for selection column cells.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

#Property Value

Type Description
RenderFragment<TreeListSelectionColumnCellDisplayTemplateContext>

The selection column’s cell template.

#Remarks

A selection column allows users to select and deselect rows. This column contains checkboxes or radio buttons depending on the selection mode.

You can define the CellDisplayTemplate to display custom content in selection column cells that correspond to data rows. Use the template’s context parameter to access the DataItem, SelectionColumn, and TreeList objects. The parameter’s Selected property specifies whether the row is selected. The VisibleIndex property returns the row’s visible index.

The following code snippet switches the TreeList to the single row selection mode and displays custom Select buttons in column cells:

@inject EmployeeTaskService EmployeeTaskService

<DxTreeList @ref="MyTreeList"
            Data="TreeListData"
            KeyFieldName="Id"
            ParentKeyFieldName="ParentId"
            SelectionMode="TreeListSelectionMode.Single"
            @bind-SelectedDataItem="@SelectedDataItem">
    <Columns>
        <DxTreeListSelectionColumn>
            <CellDisplayTemplate>
                <DxButton Click="@(() => MyTreeList.SelectRow(context.VisibleIndex))"
                          Text="Select" RenderStyle="ButtonRenderStyle.Link" />
            </CellDisplayTemplate>
        </DxTreeListSelectionColumn>
        <DxTreeListDataColumn FieldName="Name" Caption="Task" />
        <DxTreeListDataColumn FieldName="EmployeeName" />
        <DxTreeListDataColumn FieldName="StartDate" />
        <DxTreeListDataColumn FieldName="DueDate" />
    </Columns>
</DxTreeList>

@code {
    ITreeList MyTreeList { get; set; }
    List<EmployeeTask> TreeListData { get; set; }
    object SelectedDataItem { get; set; }

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

Blazor TreeList Selection Column Cell Display Template

For more information, refer to the following topic: Templates in Blazor TreeList.

See Also