Skip to main content
All docs
V24.2

ITreeListDataColumn Interface

An interface that defines a TreeList data column‘s API members (properties and methods).

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

Declaration

public interface ITreeListDataColumn :
    ITreeListColumn

Remarks

Use the ITreeListDataColumn interface when you access a TreeList data column’s API members as follows:

  • You use the @ref attribute to reference a TreeList data column.
  • You access a DataColumn object from templates or event handlers.
  • You access elements of the TreeList column collection (for instance, the collection that the GetDataColumns() method returns).

In other cases, bind your data to column parameters.

Note

To change values of a TreeList data column’s parameters outside the component’s markup, enclose your code between BeginUpdate() and EndUpdate() method calls. Otherwise, an exception occurs.

The following code snippet defines the DataColumnCellDisplayTemplate template to distinguish between odd and even rows. The template context‘s DataColumn property returns an ITreeListDataColumn object. This object is a data column to which the processed cell belongs.

@inject EmployeeTaskService EmployeeTaskService

<style>
    .my-style {
        color: blue;
        font-weight: bold;
    }
    .my-date-style {
        color: mediumblue;
        font-weight: bold;
    }
</style>

<DxTreeList Data="TreeListData" KeyFieldName="Id" ParentKeyFieldName="ParentId">
    <Columns>
        <DxTreeListDataColumn FieldName="Name" Caption="Task" />
        <DxTreeListDataColumn FieldName="EmployeeName" />
        <DxTreeListDataColumn FieldName="StartDate" />
        <DxTreeListDataColumn FieldName="DueDate" />
    </Columns>
    <DataColumnCellDisplayTemplate>
        @{
            if (context.VisibleIndex % 2 == 1) {
                if (context.DataColumn.FieldName.Contains("Date")) {
                    <span class="my-date-style">@context.DisplayText</span>
                }
                else {
                    <span class="my-style">@context.DisplayText</span>
                }
            }
            else {
                <span>@context.DisplayText</span>
            }
        }
    </DataColumnCellDisplayTemplate>
</DxTreeList>

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

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

Blazor TreeList Column Cell Display Template

See Also