Pagination controls don't work, but grid correctly talks to datasource

[Charles]

I'm currently trying to get a Kendo grid to talk to my MVC controller action and return pagable data.

I have the grid setup like so:

$(document).ready(function () {

var grid = $("#itemList").kendoGrid({

toolbar: kendo.template($("#template").html()),

columns: ["Manufacturer", "Model", "Price", "Tags"],

dataSource: {

transport: {

read: {

url: "catalogadmin/_index",

dataType: "json",

type: "POST",

data: {

filter: ""

}

},

},

schema: {

data: "data", // records are returned in the "data" field of the response

total: "total" // total number of records is in the "total" field of the response

},

pageSize: 2,

serverPaging: true

},

pageable: true

});

This correctly calls my datasource and passes in the filters etc, but the paging controls don't work. The paging controls appear but have no page numbers or totals. When I click on a next/prev page button, a JS error is thrown saying "Object does not support property or method 'slice'". If I remove the "pageable" option on the grid setup, I don't see any paging controls at all.

As far as I know, I'm correctly returning the total in the JSON result so that the grid knows the data source size:

{"total":4,"data":[data is in here and is all correct]}

Any ideas what could be going wrong here?

Thanks,
Charles

 

 

 

[Charles]

I noticed that the client side paging wasn't working either so I checked the scripts - it seems like the kendo installer had added kendo.all.min.js but also added dataviz and mvc js libraries. After removing these it solved the problem!