Hello,
I am using the Bryntum Grid with Angular 9.1.4.
How to I do custom pagination with the common OData URL query param specification, top and skip, where skip indicates the record index of which needs to skip?
Example: ?top=1 // give me a total of 1 record
Example: ?skip=10 // give me records starting from 10
Full example: ?top=10&skip=10 // give me 10 records starting from the 10th record in the database
Support Forum
We've already made changes to the parameter names. The change of parameter names is functional.
However, this question pertains to the values that the grid pagination appends to the query params.
Current grid:
Clicking "next" or page "2" on the pagination UI button makes an ajax request with the "pageStartParamName" incremented by 1. This is where our bug is. The pageStartParam name must increment by the pageSize value.
Example:
Page 1 should be "?top=10&skip=0"
Page 2 should be "?top=10&skip=10"
Page 3 should be "?top=10&skip=30"
So the question is, how can we modify how the pageStart value so that it increments ```+=``` by the pageSize value?
Top in ODATA terms is how many records you want to see.
Skip in ODATA terms is how many records you want to offset from zero.
However, this question pertains to the values that the grid pagination appends to the query params.
Current grid:
Clicking "next" or page "2" on the pagination UI button makes an ajax request with the "pageStartParamName" incremented by 1. This is where our bug is. The pageStartParam name must increment by the pageSize value.
Example:
Page 1 should be "?top=10&skip=0"
Page 2 should be "?top=10&skip=10"
Page 3 should be "?top=10&skip=30"
So the question is, how can we modify how the pageStart value so that it increments ```+=``` by the pageSize value?
Top in ODATA terms is how many records you want to see.
Skip in ODATA terms is how many records you want to offset from zero.
It does not increment the pageStart parameter. It calculates it:
If you have used 'pageParamName' by mistake, then it will look like what you report.
if you use pageStartParamName, then you can see that it requests page start (page - 1) * me.pageSize
async loadPage(page, params) {
if (this.allCount) {
page = Math.min(page, this.lastPage);
}
const
me = this,
pageParam = me.pageParamName ? {
[me.pageParamName] : page
} : {
[me.pageStartParamName] : (page - 1) * me.pageSize // <-- this is the code path that you need
};
pageParam[me.pageSizeParamName] = me.pageSize;
return me.internalLoad(Object.assign(pageParam, params), 'Page', (event) => {
// We go directly to loadPage because paging a tree store is unsupportable.
// loadPage will trigger the refresh event with { action: 'pageLoad' }
me.loadData(event.data, 'pageLoad');
});
}
if you use pageStartParamName, then you can see that it requests page start (page - 1) * me.pageSize