DxTreeList.GetVisibleColumns() Method
Returns a collection of visible columns sorted based on their display order.
Namespace: DevExpress.Blazor
Assembly: DevExpress.Blazor.v24.1.dll
NuGet Package: DevExpress.Blazor
Declaration
public IReadOnlyList<ITreeListColumn> GetVisibleColumns()
Returns
Type | Description |
---|---|
IReadOnlyList<ITreeListColumn> | The column collection. |
Remarks
The TreeList layout can include multiple zones with columns. The display order of zones is as follows:
In a zone, the TreeList displays columns based on their visible indexes in the following order:
Columns with non-negative visible indexes. The smaller the index, the more to the left the TreeList displays the column.
Columns with unset and negative visible indexes. The display order of these columns corresponds to the column order in the treelist markup.
Call the TreeList’s GetVisibleColumns
method to get a collection of visible columns sorted based on their display order. Whenever these methods encounter a band, they include it followed by all its nested columns in the collection. If nested bands exist, the methods add them and their nested columns recursively.
To get a collection of all treelist columns, call the GetColumns() method.
The following code snippet shows the difference between the results of the GetColumns
and GetVisibleColumns
methods.
@inject EmployeeTaskService EmployeeTaskService
<style>
.my-button {
width: 150px;
margin-bottom: 5px;
margin-top: 5px;
}
</style>
<DxTreeList @ref="@TreeList"
Data="TreeListData"
KeyFieldName="Id"
ParentKeyFieldName="ParentId"
@bind-SelectedDataItems="@SelectedDataItems">
<Columns>
<DxTreeListDataColumn FieldName="EmployeeName" VisibleIndex="2" />
<DxTreeListDataColumn FieldName="Name" VisibleIndex="1" />
<DxTreeListDataColumn FieldName="StartDate" />
<DxTreeListDataColumn FieldName="DueDate" />
<DxTreeListSelectionColumn VisibleIndex="0" Width="50"/>
</Columns>
</DxTreeList>
<DxButton Click="@OnGetColumns" CssClass="my-button" Text="Get Columns" />
<DxButton Click="@OnGetVisibleColumns" CssClass="my-button" Text="Get Visible Columns" />
<div><b>Columns</b>: @ColumnInfo</div>
<div><b>Visible Columns</b>: @VisibleColumnInfo</div>
@code {
List<EmployeeTask> TreeListData { get; set; }
ITreeList TreeList { get; set; }
string ColumnInfo { get; set; }
string VisibleColumnInfo { get; set; }
IReadOnlyList<object> SelectedDataItems { get; set; }
protected override void OnInitialized() {
TreeListData = EmployeeTaskService.GenerateData();
}
void OnGetColumns() {
ColumnInfo = GetColumnInfo(TreeList.GetColumns());
}
void OnGetVisibleColumns() {
VisibleColumnInfo = GetColumnInfo(TreeList.GetVisibleColumns());
}
string GetColumnInfo(IEnumerable<ITreeListColumn> columns) {
var columnInfo = columns.Select((column, index) => (1 + index) + " - " + column switch {
ITreeListDataColumn dataColumn => dataColumn.FieldName,
ITreeListSelectionColumn => "Selection Column",
_ => null
});
return string.Join("; ", columnInfo);
}
}