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

DxTreeList.SetFocusedRowIndex(Int32) Method

Moves focus to the row with the specified visible index.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

C#
public void SetFocusedRowIndex(
    int visibleIndex
)

#Parameters

Name Type Description
visibleIndex Int32

The row’s visible index.

#Remarks

When the FocusedRowEnabled property is set to true, the TreeList displays the focused row. Call the SetFocusedRowIndex method to focus the row with the specified visible index and make the row visible on the screen. The TreeList can change the current page index and scroll data rows to make the focused row visible.

Note that the row index must be between zero and the number of visible rows in the TreeList (GetVisibleRowCount) minus one; otherwise, the method does nothing. When the focused row changes, the TreeList invokes the FocusedRowChanged event.

To get the index of the currently focused row, call the GetFocusedRowIndex() method.

Note

When the TreeList is bound to the GridDevExtremeDataSource or loads data on demand, call the WaitForRemoteSourceRowLoadAsync(Int32) method before you execute the SetFocusedRowIndex method to ensure that the specified data row is loaded.

In the following code snippet, GetFocusedRowIndex() and SetFocusedRowIndex(Int32) methods move focus between rows:

@inject EmployeeTaskService EmployeeTaskService

<div class="d-flex py-2">
    <DxButton Text="Previous" Click="@(() => TreeList.SetFocusedRowIndex(TreeList.GetFocusedRowIndex() - 1))" />
    <DxButton Text="Next" Click="@(() => TreeList.SetFocusedRowIndex(TreeList.GetFocusedRowIndex() + 1))" CssClass="mx-2" />
</div>
<DxTreeList @ref="TreeList"
            Data="TreeListData"
            KeyFieldName="Id"
            ParentKeyFieldName="ParentId"
            FocusedRowEnabled="true">
    <Columns>
        <DxTreeListDataColumn FieldName="Name" Caption="Task" />
        <DxTreeListDataColumn FieldName="EmployeeName" />
        <DxTreeListDataColumn FieldName="StartDate" />
        <DxTreeListDataColumn FieldName="DueDate" />
    </Columns>
</DxTreeList>

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

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

Run Demo: TreeList - Focused Row

For more information about row focus in the TreeList component, refer to the following topic: Selection and Focus in Blazor TreeList.

See Also