Search code examples
jqueryjqgridautoscroll

Is it possible to use the virtual load on demand (scrollbar paging) in jqGrid with a JSON file loaded locally?


I need to use the virtual load on demand mode - scrollbar paging on jqGrid with a JSON local file due the file contains 12.800 rows (3.3Mb) and when is loaded at once almost freezes my Chrome (and absolutely kills my IE11). So my question is, is it posible to achieve this with my local JSON?

Here is my code (right now i'm requesting only the first 100 rows from the 'data3.json' file (which contains 12.800 rows):

$('#table').jqGrid({
    datatype: 'json',
    url: "data3.json",
    colNames: ['', 'TUBE ID'],
    colModel: [
        { name: 'selector',     index: 'selector'},
        { name: 'tube_id',      index: 'tube_id'}
    ],
    viewrecords: true,
    scroll: 1, // set the scroll property to 1 to enable paging with scrollbar - virtual loading of records
    emptyrecords: 'Scroll to bottom to retrieve new page', // the message will be displayed at the bottom 
    pager: "#jqGridPager",   
    rowNum: 100
});

Any help would be appreciated :)


Solution

  • So my question is, is it possible to achieve this with my local JSON?

    No, it's not possible. This is because with your current method you have to load the entire file in the request. You can't partially load the file.

    To do what you require you would need some server side logic to retrieve a page at a time, ideally from a more scalabale datasource than the filesystem, such as a database.