This is a migrated thread and some comments may be shown as answers.

server-side paging and 'select all'

1 Answer 693 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Chris
Top achievements
Rank 1
Chris asked on 09 Sep 2016, 06:05 PM

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 

  1. get that options item (below, I'm faking it)
  2. 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()?

  1. vm.selectAll = function () {
        console.log(vm.masterGrid.gridOptions)
        var  options = {
            data: {
                pageSize: 20,
                page: 1
            }
        };
        vm.selectAllOrders(options);
    };

1 Answer, 1 is accepted

Sort by
0
Boyan Dimitrov
Telerik team
answered on 13 Sep 2016, 08:49 AM

Hello Dave,

In general the Kendo UI DataSource is the component responsible for the data management. In order to request new data (show data for a specific page) you can use the query method of the Kendo UI DataSource. This method executes the specified query over the data items. Makes a HTTP request if bound to a remote service.

 

Regards,
Boyan Dimitrov
Telerik by Progress
 
Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
 
Tags
Grid
Asked by
Chris
Top achievements
Rank 1
Answers by
Boyan Dimitrov
Telerik team
Share this question
or