JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://cdn.kendostatic.com/2011.3.1129/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2011.3.1129/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2011.3.1129/styles/kendo.default.min.css">
<div id="grid"></div>
JavaScript
$("#grid").kendoGrid({
pageable: true,
scrollable: false,
dataSource: {
schema: {
data: function(result) {
return result.data || result;
},
total: function(result) {
var data = this.data(result);
return data ? data.length : 0;
}
},
pageSize: 4,
transport: {
read: {
url: "/echo/json/", //using jsfiddle echo service to simulate JSON endpoint
dataType: "json",
type: "POST",
data: {
// /echo/json/ echoes the JSON which you pass as an argument
json: JSON.stringify({
data: [{
text: "Item 1",
value: 1},
{
text: "Item 2",
value: 2}]
})
}
}
}
}
});