PM> Install-Package KendoGridBinder
http://kendogridbinder.apphb.com
[HttpPost]
public JsonResult Grid(KendoGridRequest request)
{
var employees = new List<Employee>
{
new Employee { EmployeeId = 1, FirstName = "Bill", LastName = "Jones", Email = "[email protected]" },
new Employee { EmployeeId = 2, FirstName = "Rob", LastName = "Johnson", Email = "[email protected]" },
new Employee { EmployeeId = 3, FirstName = "Jane", LastName = "Smith", Email = "[email protected]" },
};
var grid = new KendoGrid<Employee>(request, employees);
return Json(grid);
}
<div id="grid"></div>
<script>
var url = '@Url.Action("Grid")';
var dataSource = new kendo.data.DataSource({
serverPaging: true,
serverSorting: true,
serverFiltering: true,
pageSize: 20,
transport: {
read: {
type: 'post',
dataType: 'json',
url: url
}
},
schema: {
data: 'data',
total: 'total',
model: {
id: 'EmployeeId',
fields: {
FirstName: { type: 'string' },
LastName: { type: 'string' },
Email: { type: 'string' }
}
}
}
});
$('#grid').kendoGrid({
dataSource: dataSource,
height: 400,
columns: [
{ field: 'FirstName', title: 'First Name' },
{ field: 'LastName', title: 'Last Name' },
{ field: 'Email' }
],
filterable: true,
sortable: true,
pageable: true
});
</script>