Using Virtual Scrolling View to display millions of rows

Tutorial » Using Virtual Scrolling View to display millions of rows

The virtual scrolling feature of datagrid can be used to display large amounts of records without paging. When scrolling with the vertical scrollbar, the datagrid executes ajax requests to load and refresh the existing records. The overall behavior is smooth and with no flicker. In this tutorial we will create a datagrid and apply the virtual scrolling feature to load data from server.

View Demo

Create DataGrid

To apply the virtual scrolling feature for datagrid, the 'view' property should be set to 'scrollview'. The user should download the scrollview from datagrid extension and include the scrollview file in page head.

Notice that we don't need to use pagination property, but the pageSize property is required, with which datagrid will fetch indicated amount records from server when executing ajax request.

The Server Code

datagrid27_getdata.php

Download the EasyUI example:

easyui-datagrid-demo.zip