在网格编辑器

Question

我正在尝试创建一个kendo下拉列表，将自定义编辑器分组到kendo网格中的字段。使用编辑器时，使用分组成功填充下拉列表，但是选择任何选项会抛出javascript错误“对象不支持属性或方法'获取'”。

相关代码如下：

编辑功能：

function productDropDownEditor(container, options) {
    $('<input required name="' + options.field + '"/>')
                .appendTo(container)
                .kendoDropDownList({
                    autoBind: false,
                    dataTextField: "Name",
                    dataValueField: "Product_ID",
                    dataSource: {
                        transport: {
                            type: "json",
                            read: {
                                url: "http://localhost/Application/GetProducts",
                                dataType: "json",
                                type: "POST"
                            }
                        },
                        group: { field: "Category" }
                    }
                });
}

请注意，数据源只是从MVC服务中检索JSON对象。它将检索的一个例子如下所示：

[{Product_ID: "1", Category: "Food", Name:"Maple Syrup"}, {Product_ID: "1", Category: "Sports", Name:"Hockey Sticks"}]

供参考，以下是调用更新编辑器模板的网格：

var testSuiteGrid = $("#productsGrid").kendoGrid({
    dataSource: {
        transport: {
            read: {
                url: http://localhost/Application/GetStoreProducts,
                dataType: "json",
                type: "POST"
            },
            update: {
                url: http://localhost/Application/UpdateStoreProducts,
                datatype: "json",
                type: "POST",
                complete: function (e) {
                    productGrid.data("kendoGrid").dataSource.read();
                }
            },
            create: {
                url: http://localhost/Application/AddStoreProducts,
                dataType: "json",
                data: {
                },
                type: "POST",
                complete: function (e) {
                    productGrid.data("kendoGrid").dataSource.read();
                }
            },
            destroy: {
                url: http://localhost/Application/RemoveStoreProducts,
                dataType: "json",
                data: {
                },
                type: "POST",
                complete: function (e) {
                    productGrid.data("kendoGrid").dataSource.read();
                }
            }
        }
    },
    toolbar: ["create"],
    editable: {
        createAt: "bottom",
        mode: "inline"
    },
    columns: [
        { field: "Product_ID" },
        { field: "Product_Description" },
        { field: "Product_ID", title: "Product", editor: productDropDownEditor, template: "#=ProductName#" },
        { command: ["edit", "destroy"] }
    ],
    resizable: true,
    scrollable: false
});