Skip to main content
All docs
V25.2
  • TreeListColumnHeaderCaptionTemplateContext.IsVirtualized Property

    Returns whether the column is being virtualized.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.2.dll

    Declaration

    public bool IsVirtualized { get; }

    Property Value

    Type Description
    Boolean

    true if the column is virtualized; otherwise, false.

    Remarks

    You can activate horizontal virtual scrolling for the TreeList component as follows:

    1. Set VirtualScrollingEnabled to true.
    2. Set VirtualScrollingMode to Columns or RowsAndColumns.

    Once activated, the TreeList displays only columns that are in the viewport and virtualizes all other columns. For virtualized data columns, the TreeList component does not render column filter menus or sort glyphs. Use the IsVirtualized context property to render a specific caption while a column is virtualized.

    The following code snippet displays Loading… captions for all virtualized columns:

    Blazor TreeList - Virtualized Column Caption

    <DxTreeList @ref="MyTreeList"
                Data="TreeListData"
                KeyFieldName="Id"
                ParentKeyFieldName="ParentId"
                SkeletonRowsEnabled="SkeletonRowsEnabled"
                FilterMenuButtonDisplayMode="TreeListFilterMenuButtonDisplayMode.Always"
                VirtualScrollingMode="TreeListVirtualScrollingMode.RowsAndColumns"
                VirtualScrollingEnabled="true">
        <Columns>
            <DxTreeListCommandColumn Width="150px">
                <HeaderTemplate Context="CaptionContext">
                    @{
                        if (CaptionContext.IsVirtualized) {
                            <span>Loading...</span>
                        }
                        else {
                            <a class="oi oi-plus" @onclick="@(() => MyTreeList.StartEditNewRowAsync())" 
                               style="text-decoration: none;" href="javascript:void(0);"></a>
                        }
                    }                                    
                </HeaderTemplate>
            </DxTreeListCommandColumn>
    
            <DxTreeListSelectionColumn Width="80px">
                <HeaderTemplate Context="CaptionContext">
                    @{
                        if (CaptionContext.IsVirtualized) {
                            <span>Loading...</span>
                        }
                        else {
                            <DxButton Click="() => MyTreeList.SelectAllOnPage()" Text="Select All" />
                        }
                    }
                </HeaderTemplate>
            </DxTreeListSelectionColumn>
            @* ... *@
        </Columns>
        <ColumnHeaderCaptionTemplate Context="CaptionContext">
        @{
            if (CaptionContext.IsVirtualized) {
                <span>Loading...</span>
            }
            else {
                <span title="Click the header to sort data by this column.">
                    @CaptionContext.Caption
                </span>
            }
        }  
        </ColumnHeaderCaptionTemplate>
    </DxTreeList>
    
    @code {
        ITreeList MyTreeList;
        object TreeListData;
        // ...
    }
    
    See Also