Buddhika Samith
Buddhika Samith

Reputation: 295

Implement server-side paging with client-side Kendo UI Grid?

Can anyone tell me how can I implement server-side paging with client-side Kendo UI Grid? I use below method.

if any one use this method please help.

$(document).ready(function () {
 function loadGrid(){
$.ajax({
   .....
   data: JSON.stringify({
   //skip: skip,
   //take: take,
 }),
 success: function (result) {
var datsource = new kendo.data.DataSource({
   data: result.d,
   schema: {
       model: {
           id: "TemplateID",
           fields: {.... }
               }
            },          
       serverPaging: true,
       pageSize: 10,
   });
  $("#grdOtherBomRequest").kendoGrid({
      dataSource: datsource,                            

      serverFiltering: true,
      serverSorting: true,
      serverPaging: true,
      columns: [{....]
           });
             }

});

Upvotes: 0

Views: 2161

Answers (1)

Seuthes
Seuthes

Reputation: 91

You can take a look at the example on telerik's demo page: http://demos.telerik.com/kendo-ui/grid/remote-data-binding

The most important are listed in the config below (serverPaging, pageable). Also the service has to implement server paging. For an example you can take a look on the telerik demo service: https://github.com/telerik/kendo-ui-demos-service

$(document).ready(function() {
  $("#grid").kendoGrid({
    dataSource: {
      type: "odata",
      transport: {
        read: "//demos.telerik.com/kendo-ui/service/Northwind.svc/Orders"
      },
      schema: {
        model: {
          fields: {}
        }
      },
      pageSize: 20,
      serverPaging: true,
      serverFiltering: true,
      serverSorting: true
    },
    filterable: true,
    sortable: true,
    pageable: true,
    columns: []
  });
});

Upvotes: 1

Related Questions