Сетка Кендо не разбивается на страницы, пока колонка не сортируется

Question

Снова пейджинг не работает до тех пор, пока я не нажму на заголовок столбца, чтобы сортировать, тогда пейджинг, похоже, работает нормально.

<script type="text/javascript"> 
$(document).ready(function() { 

    $('#reportContainer').load('Reports/Scaffold.html', function() { 
     var dataSource = new kendo.data.DataSource({ 
      transport: { 
       read: { 
        type: "POST", 
        url: Reports.ServiceURL.MyService, 
        dataType: "JSON", 
        contentType: "application/json", 
        data: { myParam: "1" }, 
        serverPaging: true, 
        serverSorting: true 
       }, 

       parameterMap: function (data, operation) { 
        return kendo.stringify(data); 
       } 
      }, 

      batch: true, 
      pageSize: 50, 
      schema: { 
       data: "d" 
      } 
     }); 

     $("#allGrids").kendoGrid({ 
      dataSource: dataSource, 
      sortable: true, 
      pageable: true, 
      filterable: false, 
      height: 400, 
      columns: myModel 
     }); 
    }); 
}); 
</script> 

Answer 1

Кажется, что вы хотите, чтобы выбрать serverPagingНО вы поместили его в неправильном месте. Это поле DataSource, а не transport.read. Вы должны быть определены как:

var dataSource = new kendo.data.DataSource({ 
    transport : { 
     read  : { 
      type  : "POST", 
      url  : Reports.ServiceURL.MyService, 
      dataType : "JSON", 
      contentType: "application/json", 
      data  : { myParam: "1" } 
     }, 
     parameterMap: function (data, operation) { 
      return kendo.stringify(data); 
     } 
    }, 
    serverPaging : true, 
    serverSorting: true, 
    batch  : true, 
    pageSize  : 50, 
    schema  : { 
     data: "d" 
    } 
}); 

ПРИМЕЧАНИЕ: Не забывайте, что при определении schema.data, необходимо также определить общее количество записей, если она исходит от сервера, который вы могли бы иметь что-то вроде :

schema  : { 
    data: "d", 
    total: "total" 
} 

и сервер должен возвращать некоторые JSON, который выглядит следующим образом:

{ 
    "d": [ 
     ... 
    ], 
    "total": 100 
} 

Где 100 это общее количество или записи на сервере, а не количество записей в d.

А если неserverPaging вы можете просто сделать:

schema : { 
    data: "d", 
    total: function(data) { return data.d.length; } 
} 

@BurkeHolland, если вы хотите знать, что происходит в том, что сетка была на самом деле не делает serverPaging и, вероятно, не получает total или нет способность вычислить его. Он не был ни в режиме serverPaging, ни в режиме serverSorting, поэтому, когда @SkildLobster нажал на заголовок, он отсортировал результаты (возможно, они уже были отсортированы), а затем вычислил общее количество записей из длины данных сетки, наконец, смогло вычислить страница.

Answer 2

В случае сетки MVC Kendo я не мог видеть очевидный способ добавления схемы. Я решил проблему, получив сетку для сортировки после загрузки следующим образом. В сетке, я добавил DataBound событие:

@(Html.Kendo().Grid<tpnconnect.com.Models.Tools.NonWorkingDay>() 
      .Name("Holiday_Grid") 
      .Events(e => e 
       .DataBound("sortHolidayGridByDate") 
      ) 

Я использовал переменную JavaScript, чтобы предотвратить событие от того срабатывает несколько раз:

<script> 
    var firstBind = true; 

    function sortHolidayGridByDate() { 
     if (firstBind == true) { 
      firstBind = false; 
      var grid = $("#Holiday_Grid").data("kendoGrid"); 
      var dsSort = []; 
      dsSort.push({ field: "NonWorkingDate", dir: "desc" }); 
      grid.dataSource.sort(dsSort); 
     } 
    } 
</script>