If use the mouse or keyboard to scroll to display the last row of the grid, GridBase.onScrollToBottom event will be fired. The data rows can be loaded within this event handler and added in the data set.
grid.onScrollToBottom = function (grid) {
$.ajax({
url: "/data/orders.json",
success: function (data) {
DataLudi.loadJsonData(ds, data, {
fillMode: "append"
});
},
...
});
}
If you know the number of the entire rows which should be loaded in advance, you can call GridDataSet.setRowCount and preset the row number of the data set. Each row of the data set only takes its place with no actual value in it, but it will be added and displayed as actual rows in the grid.
You can check whether a specific row actually has the data through hasData method of the data set.
In the example below, it presets the number of the entire rows as 10,000, loads 1000 rows at 1-second intervals and updates them in the corresponding location.