Kendo ui odata request callback not supported - kendo-ui

Question

I am working on a odata grid with Kendo UI.
The problem is that the ajax request keeps containing a callback parameter. Which causes this error: Callback parameter is not supported. When I do the request manually without the callback, my odata service works perfect.
Someone an idea how to fix this?
$("#grid").kendoGrid({
dataSource: new kendo.data.DataSource({
type:"odata",
serverPaging: true,
serverFiltering: true,
serverSorting: true,
transport: {
contentType: "application/json; charset=utf-8",
type: "GET",
read: "/odata/FestivalSignUps?$inlinecount=allpages&$expand=PrefferedTasks/Task,AvailableDays,ApplicationUser",
dataType: "json",
parameterMap: function (options, type) {
var paramMap = kendo.data.transports.odata.parameterMap(options);
delete paramMap.$format; // <-- remove format parameter.
return paramMap;
}
},
pageSize: 10,
schema: {
data: function (data) {
return data["value"];
},
total: function (data) {
return data["odata.count"];
},
}
}),
filterable:true,
sortable: true,
pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5
},
columns: [
{ field: "ApplicationUser.Email", width: 90, title: "Email" },
{ field: "ApplicationUser.FirstName", width: 90, title: "Voornaam" },
{ field: "ApplicationUser.LastName", width: 90, title: "Achternaam" },
{ field: "PrefferedTasks", width: 90, title: "Taken",
template: "#= formatTasks(data) #"},
{ field: "Beschikbaar", width: 90, title: "Taken" }
]
});
Update
This code solved the problem:
$("#grid").kendoGrid({
dataSource: new kendo.data.DataSource({
type: 'odata',
transport: {
read: {
url: "/odata/FestivalSignUps?$expand=PrefferedTasks/Task,AvailableDays,ApplicationUser",
dataType: "json"
},
},
schema: {
data: function (data) {
return data["value"];
},
total: function (data) {
return data["odata.count"];
},
},
pageSize: 20,
serverPaging: true,
serverFiltering: true,
serverSorting: true
}),
filterable:true,
sortable: true,
pageable: {
refresh: true,
pageSizes: true,
buttonCount: 5
},
columns: [
{ field: "ApplicationUser.Email", width: 90, title: "Email" },
{ field: "ApplicationUser.FirstName", width: 90, title: "Voornaam" },
{ field: "ApplicationUser.LastName", width: 90, title: "Achternaam" },
{ field: "PrefferedTasks", width: 90, title: "Taken",
template: "#= formatTasks(data) #"},
{
field: "AvailableDays", width: 90, title: "Beschikbaar",
template: "#= formatDays(data) #"
},
]
});

Answer 1

I cover this issue and some others in a blog post that I wrote: Server-Side Filtering Using KendoUI With MVC4 WebAPI and OData.
If you are querying your own data, and don't need to do a cross-domain request, we can just not use jsonp. To do this, we just tell Kendo the dataType for the read operation is "json".
var dataSource = new kendo.data.DataSource({
type: 'odata', // <-- Include OData style params on query string.
transport: {
read: {
url: "/api/Albums",
dataType: "json"; // <-- The default was "jsonp".
}
}
});