kendo - datasource - parameterMap does not bind parameters
Question
I'm not sure if I'm doing this right, as I'm new to whole these systems, but I want to manage my kendo grid data (pagination, filters, etc). I'm using this ODataController in ASP.NET Web API 2, driven from version 4 of OData package, which support parameters like: $top, $skip, $count,. etc...
due reading many incomplete hello world, samples, stack thread, testing many of them, i reach to this part(The Code in below here), which is support other non-exists parameters (like: take):
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<title>AngularJS</title>
<link href="../content/shared/styles/examples-offline.css" rel="stylesheet">
<link href="../Content/telerik/content/web/kendo.common.min.css" rel="stylesheet">
<link href="../Content/telerik/content/web/kendo.rtl.min.css" rel="stylesheet">
<link href="../Content/telerik/content/web/kendo.default.min.css" rel="stylesheet">
<script src="../Content/telerik/scripts/jquery.min.js"></script>
<script src="../Content/telerik/scripts/angular.min.js"></script>
<script src="../Content/telerik/scripts/kendo.all.min.js"></script>
<script src="../content/shared/js/console.js"></script>
<script>
</script>
</head>
<body>
<a class="offline-button" href="../index.html">Back</a>
<div id="example" ng-app="KendoDemos">
<div ng-controller="MyCtrl">
<kendo-grid options="mainGridOptions"></kendo-grid>
</div>
</div>
<script>
angular.module("KendoDemos", [ "kendo.directives" ]);
function MyCtrl($scope) {
$scope.mainGridOptions = {
dataSource: {
type: "odata-v4",
transport: {
//read: "http://demos.telerik.com/kendo-ui/service/Northwind.svc/Employees"
read: "/odata/people",
dataType: "json"
},
parameterMap: function (data, operations) {
var paramMap = kendo.data.transports.odata.parameterMap(data);
if (paramMap.$inlinecount) {
if (paramMap.$inlinecount == "allpages") {
paramMap.$count = true;
}
delete paramMap.$inlinecount;
}
if (paramMap.$take) {
paramMap.$top = paramMap.$take;
delete paramMap.$take;
}
if (paramMap.$filter) {
paramMap.$filter = paramMap.$filter.replace(/substringof\((.+),(.*?)\)/, "contains($2,$1)");
}
return paramMap;
},
schema: {
data: function (data) { return data.value; },
total: function (data) { return data['@odata.count']; },
model: {
id: "Email",
fields: {
Name: {type: "string"},
Email: {type: "string"},
}
}
},
pageSize: 5,
serverPaging: true,
serverSorting: true
},
sortable: true,
pageable: true,
//detailTemplate: kendo.template($("#template").html()),
dataBound: function() {
this.expandRow(this.tbody.find("tr.k-master-row").first());
},
columns: [
{
field: "Name",
title: "Name",
width: "200px"
},
{
field: "Email",
title: "E-Mail",
width: "200px"
},
]
};
}
</script>
</body>
</html>
The code use a injected anonymous function, which let it to define custom parameters and map them.
parameterMap: function (data, operations) {
var paramMap = kendo.data.transports.odata.parameterMap(data);
if (paramMap.$inlinecount) {
if (paramMap.$inlinecount == "allpages") {
paramMap.$count = true;
}
delete paramMap.$inlinecount;
}
if (paramMap.$take) {
paramMap.$top = paramMap.$take;
delete paramMap.$take;
}
if (paramMap.$filter) {
paramMap.$filter = paramMap.$filter.replace(/substringof\((.+),(.*?)\)/, "contains($2,$1)");
}
return paramMap;
},
schema: {
data: function (data) { return data.value; },
total: function (data) { return data['@odata.count']; },
model: {
id: "Email",
fields: {
Name: {type: "string"},
Email: {type: "string"},
}
}
},
pageSize: 5,
serverPaging: true,
serverSorting: true
},
I, after checking over things, and change a little here and there, like, setting schema, and add new conditions (as they were left blank on the sample code).
Now, what is issued me, is that after running my application, I noticed, not even it doesn't apply my snippet code...
if (paramMap.$take) {
paramMap.$top = paramMap.$take;
delete paramMap.$take;
}
but it even doesn't applied the other section, and also JavaScript debugger won't break inside the function... . so for example it won't add parameters like, count...
So, i come here to first, make sure i go the right way, and second that if it's right way, then how to fix it...
i also read something about change things to JSON, but i assume my data is JSON, as i don't define any inline string...
2 answers
solution1
2 2015-06-11 00:38:36
The parameterMap should be defined at the transport level (see kendo documentation ). In your code, you did define the parameterMap at the dataSource level.
I'm not sure if your extra parameters would be sent as you want but at least it explain why parameterMap isn't called.
Here's how it should be:
var dataSource = new kendo.data.DataSource({
transport: {
read: {
url: "http://whatever.com
},
parameterMap: function(data, type) {
//parameterMap should be a child of the transport object
//...
}
}
//<-- You added the parameter map there as a transport sibling.
});
solution2
1 ACCPTED 2015-06-11 00:19:26
kendo does support oData v4 now, so just make sure you got the right version and it will handle the url automatically. then you may want to get rid of the 'parameterMap' part and change the 'read' to
read: {
url:'/odata/people',
dataType: 'json'
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.