[oscar.vanderleijParticipant]

Issue was caused by something else. Solution found in this topic: https://www.jqwidgets.com/community/topic/overactive-sort-event/

[oscar.vanderleijParticipant]

Created a JSFiddle: https://jsfiddle.net/oscarvanderleij/6j43jLv9/

Please open the console and try scrolling down couple of times short after eachother and see the error message in the console:

jqx-all.js:106 Uncaught Error: jqxGrid: The data is still loading. When the data binding is completed, the Grid raises the 'bindingcomplete' event. Call this function in the 'bindingcomplete' event handler.
    at b.(anonymous function).sortby (https://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqx-all.js:106:3906)
    at b.jqx.dataview.dataview.update (https://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqx-all.js:90:53538)
    at q (https://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqx-all.js:90:267100)
    at Object.l (https://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqx-all.js:90:267157)
    at i.jqx.dataAdapter.callDownloadComplete (https://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqx-all.js:18:32074)
    at Object.success (https://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqx-all.js:18:22405)
    at bw (https://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqx-all.js:7:9062)
    at Object.fireWith [as resolveWith] (https://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqx-all.js:7:10024)
    at S (https://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqx-all.js:18:64582)
    at XMLHttpRequest.H (https://www.jqwidgets.com/jquery-widgets-demo/jqwidgets/jqx-all.js:18:71052)

[oscar.vanderleijParticipant]

Using version 5.4.0 and this issue still exists. The Error is thrown as this line of code “sortby:function(a,b,c,d,e){if(this._loading&&!1!==e)throw new Error(“jqxGrid: “+this.loadingerrormessage);”. The this._loading is true but the grid already seems loaded/bounded.

Hereby my React code snippets.

const source = {
    url: Settings.apiEndpoint + 'project/' + this.props.projectId + '/targets/?format=json',
    datatype: 'json',
    cache: false,
    datafields: [
        { name: 'id', type: 'int' },
        { name: 'name', type: 'string' },
        { name: 'address', type: 'string' },
        { name: 'user_id', type: 'int' },
        { name: 'user_full_name', type: 'string' },
        { name: 'user_avatar',type: 'string' },
        { name: 'lat', type: 'float' },
        { name: 'lon', type: 'float' }
    ],
    root: 'results',
    beforeprocessing: function (data) {
        source.totalrecords = data.count;
    },   
    filter: () => {
        // update the grid and send a request to the server.
        this.refs.grid.updatebounddata('filter');
    },
    sort: () => {
        // update the grid and send a request to the server.
        this.refs.grid.updatebounddata('sort');
    }
};
this.state.dataAdapter = new $.jqx.dataAdapter(source,{});

<JqxGrid
    ref="grid"
    source={this.state.dataAdapter}
    columns={this.state.columns}
    filterable={true}
    sortable={true}
    sorttogglestates={1}
    showfilterrow={true}
    rowsheight={52}
    theme={'inspinia'}
    rowdetails={true}
    initrowdetails={initrowdetails}
    rowdetailstemplate={rowdetailstemplate}
    width={'100%'}
    height={'100%'}
    selectionmode={'multiplerowsextended'}
    virtualmode={true}
    rendergridrows={rendergridrows}
    />

[Author]

Posts