Pagination with Datatable loading on action

Webix JS
#1

hello,
I’m hoping someone can help me by pointing out my error / omission.
My scenario involves a datatable that loads records based on a user selecting a node in a tree. The datatable can have up to half a million records so pagination is a necessity. Because the table needs to load based on a user selection, i cannot use the usual url parameter within the datatable definition, so I’m using dtable.load() as below

dtable.load(function(){
    return webix.ajax().post( url, postData)
});

with the postData providing the necessary details of the user selection. The datatable loads the initial page but unfortunately I can’t get the datatable to automatically add the count, start parameters etc. so it doesn’t work correctly. I have other datatables within the application where i am able to use the url parameter and those scenarios work as expected and desired with pagination and server side filtering and sorting.

Is there something obvious i’m doing wrong? Or is there a a more appropriate approach to loading potentially huge datasets into a paginated table on a user action? All the documents and examples I could find use the standard data loading on initialisation approach, which obviously cannot work for me.
Thanks for any and all assistance
-SrvrSide

#2

Hi @SrvrSide

In general, it is a valid way of data loading, but note that parameters required for dynamic loading and server-side filtering/sorting will be passed to this function in 1st argument.
Please, check the following example: Code Snippet

Unfortunately I can’t get the datatable to automatically add the count, start parameters etc.

The function declared in the load() method remains in the component as a data source ( similar to the initial url at Code Snippet ) and receives the same parameters.

To reload the data properly, you will need to conjoin these default parameters and your custom properties for each request.

#3

Thank you very much for the reply and information Listopad,
I have adjusted as you suggest to include an argument to the load() function as below.

        var postData = Object.assign( {}, details, p );
        return webix.ajax().get(URL, postData);
});```
It makes a difference but is still not behaving as expected. I'm using a pager (as a separate component) and i seem to be confusing the dynamic loading (ajax calls upon scroll events) documentation with the pager capability and documentation.  I wish to load 500 records at a time based on interaction with the pager control, i do not wish to have records load in small blocks as a user scrolls. Despite setting the pager to `size:500, group:5` the ajax calls are issuing requests with `count:50, continue:true`.
I apologise if the question is basic and covered in the documentation but for the life of me I cannot work out what i'm doing wrong.
- SrvrSide
#4

hello @Listopad,
I have upgraded to 7.4.2 but despite the pager being defined as view:"pager", size:500, group:5... the dtable.load() function was being presented with count:50, continue:true as arguments (along with the start and filter values). It seems I needed to add the datafetch:500 argument to the datatable definition as after adding it I’m now getting the expected behaviour with pages of 500 rows being loaded … more or less.
What i now have is a continuous reload of the first page every couple of seconds. The pagination does work, but in the background It looks like something is setting a promise and _feed_on_load() is being called. The stack trace is just a repeated pattern (I don’t know how to include images to show you).
Are you able to offer any pointers as to what might be causing this constant reloading?
Thank you for any insights and assistance

  • SrvrSide