Why parameterMap is not calling in KendoGrid? - kendo-ui

Question

have the following kendo grid:
this.kGrid = $element.kendoGrid({
columns: [
{ field: 'Title' },
{ field: 'Description' },
{
field: 'StartDate',
title: 'Start Date',
template: `#= kendo.toString(kendo.parseDate(DistributionDate), "${DATE_FORMAT} ${TIME_FORMAT}")#`,
}
],
filterable: true,
dataSource: {
type: 'aspnetmvc-ajax',
transport: {
read: {
url: '/Pubs/GetPubs',
dataType: "json",
type: 'POST',
data: () => ({
collectionId: this.selectedCollection,
categoryUid: this.selectedCategory
})
},
parameterMap: function (data, type) {
//i wawnt to add some logic here to convert StartDate from local time to UTC
}
},
serverFiltering: true,
schema: {
data: 'Data',
total: 'Total',
model: {
id: 'Uid',
fields: {
Title: { type: 'string' },
Description: { type: 'string' },
StartDate: { type: 'date' }
}
}
}
}
}).data('kendoGrid');
So i have a grid with 3 columns and all of them are filterable. My goal is to convert the date in the filter for StartDate from local time to UTC. That's why i added parameterMap handler. But for some reason, parameterMap method is not called at all. What i'm doing wrong here?
Here is full code snippet - https://dojo.telerik.com/IqadArAn/3. But the problem is not reproducible here
EDIT: It seems that problem is in dataSource type, which is 'aspnetmvc-ajax'. If to change the dataSource type, parameterMap works.

Answer 1

The alternative solution is to:
Skip setting the transport type
Implement custom read method
This questions describes the similar issue - https://www.telerik.com/forums/datasource-transport-function-mode-read-and-wrong-request-parameters.
Here is the code of custom read method, which should be placed inside of dataSource.transport.
read: (optionsData) => {
if (optionsData.data.filter) {
optionsData.data.filter.filters.forEach((item) => {
if (item.field === "StartDate") {
item.value = item.value.toISOString();
}
});
}
var data = kendo.data.transports["aspnetmvc-ajax"].prototype.options.parameterMap.call({ options: { prefix: "" }}, optionsData.data, "read", false);
data.encryptedCollectionId = this.selectedCollection;
data.categoryUid = this.selectedCategory;
$.ajax({
type: "POST",
url: 'Pubs/GetPubs',
data: data
})
.then(
function succes(res) {
optionsData.success(res);
},
function failure(res) {
optionsData.error(res);
}
);
}