DxDataGrid<T>.DataNavigationMode Property

Specifies how users navigate through grid data.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v21.1.dll

Declaration

[Parameter]
public DataGridNavigationMode DataNavigationMode { get; set; }

Property Value

Type Description
DataGridNavigationMode

One of the DataGridNavigationMode enumeration values.

Available values:

Name Description
Paging

Users use a pager to navigate through data.

VirtualScrolling

Users use the vertical scrollbar to navigate through data. When a user scrolls, the grid loads and renders data rows that become visible.

ShowAllDataRows

All grid rows are displayed on one page. In this mode, the grid does not display the pager.

Remarks

The code below enables the virtual scroll feature in the Data Grid. Users should use the vertical scrollbar to navigate through data. When a user scrolls, the grid loads and renders the data rows that become visible.

The list below enumerates requirements and basic principles of Virtual Scrolling mode:

  • All rows have the same height.
  • The component hides the pager and shows the Edit Form in a pop-up window.
  • Set the Width property for all Data Grid columns. Columns with unspecified widths might be hidden if the Data Grid does not have sufficient space to display them.

    Refer to the following topic for more information: Table Layout Specifics.

<DxDataGrid Data="@DataSource" 
    DataNavigationMode="DataGridNavigationMode.VirtualScrolling" >
    ...
</DxDataGrid>

DataGrid NavigationMode

Refer to the following topic for more information: Table Layout Specifics.

Run Demo: Data Grid - Virtual Scrolling

See Also