Skip to main content
All docs
V25.1
  • DxGrid.SetFocusedRowIndex(Int32) Method

    Moves focus to the row with the specified visible index.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    Declaration

    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 grid 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 Grid 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 grid (GetVisibleRowCount) minus one; otherwise, the method does nothing. When the focused row changes, the grid invokes the FocusedRowChanged event.

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

    You can use the SetFocusedDataItemAsync(Object) method to focus the row that corresponds to the specified data item.

    Note

    The Grid bound to an Instant Feedback Data Source or GridDevExtremeDataSource loads data asynchronously in small portions (instead of the entire dataset). Before you call the SetFocusedRowIndex method, call the WaitForRemoteSourceRowLoadAsync(Int32) method to ensure that the specified data row is loaded.

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

    <div class="d-flex py-2">
        <DxButton Text="Previous" Click="@(() => Grid.SetFocusedRowIndex(Grid.GetFocusedRowIndex() - 1))" />
        <DxButton Text="Next" Click="@(() => Grid.SetFocusedRowIndex(Grid.GetFocusedRowIndex() + 1))" CssClass="mx-2" />
    </div>
    <DxGrid @ref="Grid" Data="Data" FocusedRowEnabled="true">
        <Columns>
            <DxGridDataColumn FieldName="ContactName" />
            <DxGridDataColumn FieldName="CompanyName" />
            <DxGridDataColumn FieldName="City" />
            <DxGridDataColumn FieldName="Country" />
        </Columns>
    </DxGrid>
    

    Run Demo: Grid - Focused Row

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

    See Also