Blazor DataGrid Example - Lazy Load with Paging
This sample demonstrates lazy loading with grouping and paging in the DataGrid component. In this sample, the data is grouped by the Product Name column.
Order ID | ProductID Press Ctrl space to group | Product Name Press Ctrl space to group | Customer ID Press Ctrl space to group | Units In Stock Press Ctrl space to group |
|---|
The Blazor DataGrid is configured for lazy loading by setting the EnableLazyLoading property to true in the GridGroupSettings and enabling paging by setting the AllowPaging property to true. The number of records displayed per page can be controlled using the PageSize property from GridPageSettings.
In this sample, the DataGrid is initially grouped by the Product Name column, displaying only the caption rows in a collapsed view. When a caption row is expanded, the corresponding grouped records are loaded dynamically based on the defined page size. This approach avoids rendering the entire grouped dataset at once, resulting in improved performance and efficient handling of large datasets.
More information about the lazy loading grouping feature can be found in this documentation section.