I'm not sure I'm totally getting The Kendo Way of the doing things yet. My instinct is to get the data I need from the grid, do what I need with it, then manually update the grid. It seems to me, the grid want to be the single point of truth for data and functions.
I am using server-side paging with an API. The API can cope with pageSize and page parameters, which are defined in the grid. That means I am only ever seeing, say, 20 records at a time. To do this, the read function has an options param that "magically" contains pageSize and page.
vm.masterGrid.dataSource = new kendo.data.DataSource({
pageable: {
pageSizes: true,
buttonCount: 5
},
pageSize: 20,
serverPaging: true,
serverSorting: true,
serverFiltering: true,
transport:{
read: function(options) {
return vm.getOrders(options);
}
},
}
});
I want to be able to check one or several or all, or even all-minus-one orders, and send them "down the pipe".
Each row has a checkbox, and then there is a 'Select All' button.
Since the grid only sees a small window of data, I don't think I can keep track of all order states in the front end. (If I'm on page one, the grid knows nothing about any orders except the first 20).
So, my solution is to have a separate end-point: api/orders/selectall. It has no params (except pageSize and page) and simply tells the back end to flag all orders as 'in-progress'. Upon return, it needs to deliver tohse 20 records and tell the grid to refresh.
So my question(s), after all that is/are:
How does my select all button interact with the grid?
I need to
- get that options item (below, I'm faking it)
- make the call via my api, and stuff the new data back into the grid
Do I call read()? How? I'm outside the grid. vm.masterGrid.dataSource.read()?
-
vm.selectAll =
function
() {
console.log(vm.masterGrid.gridOptions)
var
options = {
data: {
pageSize: 20,
page: 1
}
};
vm.selectAllOrders(options);
};