I am trying to establish paging using a Kendo Grid. However when I try I get the 'Object doesnt support property of method 'slice'' error.
Here is my code.
JS file
$(
function
() {
dataSource.bind(
"error"
, dataSource_error);
$(
"#CollegeProgramsGrid"
).kendoGrid({
dataSource: dataSource,
pageable:
true
,
bob:
true
,
columns: [
{title:
"CIP Code"
, field:
"CipCode"
,width:
"110px"
,attributes: {
"class"
:
"table-cell-auto text-center"
} },
{title:
"Program Name"
,field:
"ProgramName"
,width:
"110px"
,attributes: {
"class"
:
"table-cell-auto text-center"
},groupable:
false
},
{title:
"Degree Type"
,field:
"DegreeType"
, width:
"110px"
,attributes: {
"class"
:
"table-cell-auto text-center"
},groupable:
false
}
]
});
});
function
dataSource_error(e) {
alert(e.status);
// displays "error"
}
var
dataSource =
new
kendo.data.DataSource({
transport: {
read: {
url: window.location.origin +
"/Program/ProgramListing/2"
,
dataType:
"json"
},
schema: {
data:
"data"
,
total:
"count"
,
model: {
id:
"ProgramID"
,
fields: {
CipCode: { type:
"string"
},
ProgramName: { type:
"string"
},
Credits: { type:
"number"
},
Tuition: { type:
"number"
},
DegreeType: { type:
"string"
},
HighWage: { type:
"boolean"
},
HighDemand: { type:
"boolean"
},
HighSkill: { type:
"boolean"
},
ProgramID: { type:
"number"
}
}
}
},
},
pageSize: 25,
serverPaging:
true
});
Here is my Response Object
public
class
Response
{
public
Array data {
get
;
set
; }
public
int
count {
get
;
set
; }
public
Response(Array data,
int
count)
{
this
.data = data;
this
.count = count;
}
}
This is the controller code
public
Response GetProgramsListByCollegeId(
int
collegeId,
int
take,
int
skip)
{
var dbContext =
new
VirtualCounselorEntities();
var programs = (from p
in
dbContext.Programs
where p.CollegeID == collegeId
select
new
vmProgramListItem {
ProgramId = p.ProgramId,
CipCode = p.CipCode,
CollegeID = p.CollegeID,
ProgramName = p.ProgramName,
DegreeType = p.DegreeLevel.Name,
Tuition = p.Tuition,
HighDemand = p.HighDemand,
HighSkill = p.HighSkill,
HighWage = p.HighWage
})
.OrderBy(r => r.CipCode)
.Skip(skip).Take(take).ToArray() ;
int
count = dbContext.Programs
.Where(r => r.CollegeID == collegeId)
.Count();
return
new
Response(programs, count);
}
Viewing the request response, I am getting good JSON back.
{"data":[{"ProgramId":9,"CipCode":"10.0202","ProgramName":"MEDIA TECHNOLOGY-RADIO (1251)","CollegeID":2,"Credits":0,"Tuition":1400,"DegreeType":"Two Year Certification","HighWage":"N","HighDemand":"N","HighSkill":"N"},...
{"ProgramId":30,"CipCode":"15.0699","ProgramName":"GENERAL TECHNOLOGY (0213)","CollegeID":2,"Credits":0,"Tuition":3300,"DegreeType":"Four Year Certification","HighWage":"N","HighDemand":"N","HighSkill":"N"}],"count":176}
Everything looks right and appears to match https://github.com/telerik/kendo-examples-asp-net-mvc/blob/master/grid-crud/Views/Home/Index.cshtml
Please provide any assistance you can.
dw