【问题标题】:Kendo UI for jQuery Grid date not posting to the server side用于 jQuery Grid 日期的 Kendo UI 未发布到服务器端
【发布时间】:2019-03-27 04:09:05
【问题描述】:

我遇到了 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 Grid 发送到服务器端?

【问题讨论】:

    标签: jquery asp.net-mvc kendo-ui kendo-grid kendo-datepicker


    【解决方案1】:

    尝试以其他格式发布日期。您可以使用parameterMap 更改格式:

    transport: {
        // ...
        parameterMap: function (data, type) {
            if (type != "read") {
                data.FoundDate = kendo.toString(data.FoundDate, "dd/MM/yyyy");
            }
            return data; 
        }
    }
    

    【讨论】:

    • ViewModel中FoundDate的数据类型为DateTime?
    • 是的,视图模型中FoundDate的数据类型应该是DateTime?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-01-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多