JavaScript
var Model = kendo.data.Model.define({
id: "EmployeeID",
fields: {
EmployeeID:{editable: false, nullable: false},
FirstName: {type: "string"},
LastName: {type: "string"},
StateId: {type: "number"},
CityId: {type: "number"},
DOB:{type: "date"},
Age:{type:"number"}
}
});
var states = [{ Id: 1, Name: "Gujarat" }, { Id: 2, Name: "Maharastra" }, { Id: 3, Name: "MP" }, { Id: 4, Name: "UP" }];
var cities = [{ Id: 1, StateId: 1, Name: "Surat" }, { Id: 2, StateId: 2, Name: "Mumbai" },
{ Id: 3, StateId: 1, Name: "Baroda" }, { Id: 4, StateId: 2, Name: "Pune" },{Id:5,StateId:3,Name:"Ujjain"},{Id:6,StateId:4,Name:"Kanpur"}];
var employees = [{ EmployeeID: 1, FirstName: "Keyur", LastName: "Patel", StateId: 1, CityId: 1, DOB:"03/22/1983",Age:31 },
{ EmployeeID: 2, FirstName: "Prasanjeet", LastName: "Debnath", StateId: 2, CityId: 2, DOB:"08/15/1987",Age:27 },
{ EmployeeID: 3, FirstName: "Namrata", LastName: "Patel", StateId: 2, CityId: 4, DOB:"09/10/1983",Age:30 }];
var employeeDataSource = new kendo.data.DataSource({
data: employees,
schema:{
model:Model
},
transport: {
read: function (o) {o.success(employees);},
create: function (o) {
o.success(o.data);
},
update: function (o) { o.success(); },
destroy: function (o) { o.success(); }
},
});
$("#EmployeeList").kendoGrid({
dataSource: employeeDataSource,
columns:[
{
field:"FirstName",
title:"First Name"
},
{
field:"StateId",
title:"State"
},
{
field:"CityId",
title:"City"
},
{
field:"DOB",
title:"DOB",template:"#=kendo.toString(DOB,'d')#"
},
{
field:"Age",
title:"Age"
},
{
command: ["edit"]
}
],
editable:"inline"
});