Kendo UI for jQuery 网格日期未发布到服务器端
Kendo UI for jQuery Grid date not posting to the server side
我遇到 Kendo 网格弹出编辑器未向服务器端发送 date
数据的问题。
请看下面的代码:
JavaScript:
$(document).ready(function () {
var serviceBaseUrl = "@Request.Url.ToString()",
lostPropertyDataSource = new kendo.data.DataSource({
transport: {
create: {
url: serviceBaseUrl + "/AddLostProperty",
type: "POST",
dataType: "json",
},
read: {
url: serviceBaseUrl + "/GetLostProperties",
type: "GET",
dataType: "json",
contentType: 'application/json; charset=utf-8',
},
update: {
url: serviceBaseUrl + "/UpdateLostProperty",
type: "POST",
dataType: "json"
},
destroy: {
url: serviceBaseUrl + "/DeleteLostProperty",
type: "DELETE",
dataType: "json"
},
},
requestEnd: onRequestEnd,
pageSize: 20,
schema: {
model: {
id: "PropertyId",
fields: {
//PropertyId: { type: "number", nullable: true },
PropertyName: { type: "string", editable: true, validation: { required: true } },
CategoryName: { type: "string", editable: true, validation: { required: true } },
PropertyDescription: { validation: { required: false } },
//Image: { validation: { required: false } },
FoundDate: { type: "date", format: '0:dd-MM-yyyy' },
FoundLocation: { editable: true, validation: { required: false } }
}
}
},
});
$("#manageLostPropertiesGrid").kendoGrid({
dataSource: lostPropertyDataSource,
pageable: true,
height: 550,
toolbar: ["create"],
columns: [
//{ command: { text: "View Photo", click: showPhoto }, title: " ", width: "180px" },
{ field: "PropertyName", title: "Property Name", width: "150px" },
{ field: "CategoryName", title: "Category", editor: propertyCategoryList, width: "150px"},
{ field: "PropertyDescription", title: "Description", width: "200px" },
{ field: "FoundDate", type: "date", title: "Found Date", format: "dd/MM/yyyy", template: "#= kendo.toString(kendo.parseDate(FoundDate, 'dd-MM-yyyy'), 'dd/MM/yyyy') #", width: "130px" },
{ field: "FoundLocation", title: "Found Location", width: "120px" },
{ command: ["edit", "destroy"], title: " ", width: "250px" }],
editable: "popup"
}).data("kendoGrid");
function onRequestEnd(e) {
if (e.type != "read") {
e.sender.read();
}
}
function propertyCategoryList(container, options) {
$('<input name="' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
autoBind: true,
dataTextField: "CategoryName",
dataValueField: "CategoryName",
valuePrimitive: false,
autoBind: true,
dataSource: {
transport: {
read: serviceBaseUrl + "/GetPropertyCategories",
}
}
});
}
});
视图模型获得了其他数据,但日期获得了 null
值,即使在网格中输入了日期。
并且客户端发布的数据可以在浏览器中看到:
问题是如何将date
从Kendo网格发送到服务器端?
尝试以其他格式发布日期。您可以使用 parameterMap 更改格式:
transport: {
// ...
parameterMap: function (data, type) {
if (type != "read") {
data.FoundDate = kendo.toString(data.FoundDate, "dd/MM/yyyy");
}
return data;
}
}
我遇到 Kendo 网格弹出编辑器未向服务器端发送 date
数据的问题。
请看下面的代码:
JavaScript:
$(document).ready(function () {
var serviceBaseUrl = "@Request.Url.ToString()",
lostPropertyDataSource = new kendo.data.DataSource({
transport: {
create: {
url: serviceBaseUrl + "/AddLostProperty",
type: "POST",
dataType: "json",
},
read: {
url: serviceBaseUrl + "/GetLostProperties",
type: "GET",
dataType: "json",
contentType: 'application/json; charset=utf-8',
},
update: {
url: serviceBaseUrl + "/UpdateLostProperty",
type: "POST",
dataType: "json"
},
destroy: {
url: serviceBaseUrl + "/DeleteLostProperty",
type: "DELETE",
dataType: "json"
},
},
requestEnd: onRequestEnd,
pageSize: 20,
schema: {
model: {
id: "PropertyId",
fields: {
//PropertyId: { type: "number", nullable: true },
PropertyName: { type: "string", editable: true, validation: { required: true } },
CategoryName: { type: "string", editable: true, validation: { required: true } },
PropertyDescription: { validation: { required: false } },
//Image: { validation: { required: false } },
FoundDate: { type: "date", format: '0:dd-MM-yyyy' },
FoundLocation: { editable: true, validation: { required: false } }
}
}
},
});
$("#manageLostPropertiesGrid").kendoGrid({
dataSource: lostPropertyDataSource,
pageable: true,
height: 550,
toolbar: ["create"],
columns: [
//{ command: { text: "View Photo", click: showPhoto }, title: " ", width: "180px" },
{ field: "PropertyName", title: "Property Name", width: "150px" },
{ field: "CategoryName", title: "Category", editor: propertyCategoryList, width: "150px"},
{ field: "PropertyDescription", title: "Description", width: "200px" },
{ field: "FoundDate", type: "date", title: "Found Date", format: "dd/MM/yyyy", template: "#= kendo.toString(kendo.parseDate(FoundDate, 'dd-MM-yyyy'), 'dd/MM/yyyy') #", width: "130px" },
{ field: "FoundLocation", title: "Found Location", width: "120px" },
{ command: ["edit", "destroy"], title: " ", width: "250px" }],
editable: "popup"
}).data("kendoGrid");
function onRequestEnd(e) {
if (e.type != "read") {
e.sender.read();
}
}
function propertyCategoryList(container, options) {
$('<input name="' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
autoBind: true,
dataTextField: "CategoryName",
dataValueField: "CategoryName",
valuePrimitive: false,
autoBind: true,
dataSource: {
transport: {
read: serviceBaseUrl + "/GetPropertyCategories",
}
}
});
}
});
视图模型获得了其他数据,但日期获得了 null
值,即使在网格中输入了日期。
并且客户端发布的数据可以在浏览器中看到:
问题是如何将date
从Kendo网格发送到服务器端?
尝试以其他格式发布日期。您可以使用 parameterMap 更改格式:
transport: {
// ...
parameterMap: function (data, type) {
if (type != "read") {
data.FoundDate = kendo.toString(data.FoundDate, "dd/MM/yyyy");
}
return data;
}
}