CODEWITHSUNDEEP
datagridpaginationdojo
Vincent-ks2
Vincent-ks2

Reputation: 31

dojo enhanced grid server side pagination not working

I'm facing an issue when trying to perform server side pagination using an enhanced datagrid (dojo v1.10). The first page is correctly displayed, but the widget (store ? grid ? plugin ?) seems to ignore the 'Content-Range' header value in response and does not allow to get next page. For example with response header containing 'Content-Range: items 0-9/17', pagination displays '1 to 10 of 10 items', and next page is not available.

After some debug I see that range value is correctly read from JsonRest store (query function)

    results.total = results.then(function(){
    var range = results.ioArgs.xhr.getResponseHeader("Content-Range");
    return range && (range = range.match(/\/(.*)/)) && +range[1];
    }); 
...

But in fetch method from ObjectStore, totalCount value is undefined, results.length is then used:

var results = this.objectStore.query(query, args);
        Deferred.when(results.total, function(totalCount){
            Deferred.when(results, function(results){
                if(args.onBegin){
                    args.onBegin.call(scope, totalCount || results.length, args);
...

Any idea ?

Thanks,

My code:

// get grid store
var restStore = new JsonRest(
    {
        target: "ks2/api/workflow/...",
    });
var memoryStore = new Memory();
var store = Cache(restStore, memoryStore);      

/*set up layout*/
var layout = [{
            name: "id",
            field: 'id',
            width: '5%',
            datatype:"string"
        },
        ....
    ];

/*create a new grid*/
this.workflowGridWidget = new EnhancedGrid({
        id: 'workflowGridWidget',
        store: new ObjectStore({objectStore: store}),
        structure: layout,
        rowSelector: '20px',
        plugins: {
            pagination: {
                          pageSizes: ["10", "25", "50"],
                          defaultPageSize: 10,
                          description: true,
                          sizeSwitch: true,
                          pageStepper: true,
                          gotoButton: true,
                          maxPageStep: 4,//page step to be displayed
                          position: "bottom" //position of the pagination bar
                      }
        }
    });

/*append the new grid to the div*/
this.workflowGridWidget.placeAt("workflowDataGrid");

/*Call startup() to render the grid*/
this.workflowGridWidget.startup();

Upvotes: 0

Views: 296

Answers (1)

Vincent-ks2
Vincent-ks2

Reputation: 31

I found the issue: I was using a non dojo restful compliant API, and I needed to add JSON response post-processing using

aspect.after(store, "query", this.processResponse);
...

processResponse: function ks2ProcessMonitor_datagrid_WorkflowDataGrid_processResponse(deferred) {
    return deferred.then(function(response) {
        //process response content
        return processedResponse;   
    });
},

This was working properly but for some reason, it has an impact on pagination. Removing this post-processing (using another API which is dojo compliant) fix the pagination issue. Maybe I should try response post-processing using an Observable as suggested by Layke.

Upvotes: 0

Related Questions