DevExtreme v24.2 is now available.

Explore our newest features/capabilities and share your thoughts with us.

Your search did not match any results.

React Data Grid - Infinite Scrolling

If the DataGrid component is bound to a large dataset, you can enable infinite scroll mode to optimize data load times and improve user navigation. The component initially displays one page of rows. When users scroll to the end of the view, the DataGrid loads an additional page. Users can only load pages sequentially and cannot skip to arbitrary positions within the dataset.

To enable infinite scroll mode, set the scrolling.mode to "infinite".

In this demo, the DataGrid is bound to a dataset of 100,000 records. Scroll to the last record to load the next page of records.

To give you the ability to edit code on the fly, the demo uses SystemJS. For this reason, launching the demo takes some time. We strongly recommend that you do not use this approach in real projects.
Backend API