Kendo UI网格comboBox未定义焦点出来？

Question

我正在使用Keno UI网格，我在网格中添加了一个comboBox作为列，该列也支持自动完成功能。显然，comboBox工作正常但是当我键入一半的世界并将焦点从comboBox单元格中移出时，它显示未定义。我试图在组合框更改事件上处理它，但它仍然显示未定义的值？下面是我的组合框和网格代码。

   function productDropDownEditor(container, options) {
    $('<input id="ProductDropDown" style="width:250px;" data-bind="value:' + options.field + '"/>')
    .appendTo(container).kendoComboBox({
        dataSource: dataSource,
        autoBind: false,
        dataTextField: 'ProductName',
        dataValueField: 'ProductID',
        filter: "contains",
        suggest: true,
        index: 3,
        change: function (e) {
            debugger;
            var cmb = this;
            // selectedIndex of -1 indicates custom value
            if (cmb.selectedIndex < 0) {
                cmb.value(0); // or set to the first item in combobox
            }
        },
        close: function (e) {
            debugger;
            var cmb = this;


        }
    });

以下是关于kendo网格的代码。

$(function () {

    $("#grid").kendoGrid({

        columns: [

           {
               field: "Products", width: "250px",
               editor: productDropDownEditor,
               title: "Product",
               template: "#=Products.ProductName#",
               attributes: {
                   "class": "select2_single"
               }
           },
           { field: "PurchasePrice", width: "150px" },
           { field: "PurchaseQuantity", width: "150px" },
            { field: "SaleRate", title: "Sale Rate", width: "150px" },
             { field: "Amount", title: "Amount", width: "150px" },
           { command: "destroy", title: "Delete", width: "110px" },

        ],
        editable: true, // enable editing

        pageable: true,
        navigatable: true,
        sortable: true,
        editable: "incell",
        toolbar: ["create"], // specify toolbar commands
        edit: function (e) {
            //debugger;
            //// var parentItem = parentGrid.dataSource.get(e.model.PurchaseID);
            ////e.model.set("ShipCountry", parentItem.Country);
            //if (e.model.isNew()) {
            //    // set the value of the model property like this                    
            //    e.model.set("PropertyName", Value);
            //    // for setting all fields, you can loop on 
            //    // the grid columns names and set the field
            //}
        },
        //editable: "inline",
        dataSource: {
            serverPaging: true,
            requestStart: function () {
                kendo.ui.progress($("#loading"), true);
            },
            requestEnd: function () {
                kendo.ui.progress($("#loading"), false);

            },
            serverFiltering: true,
            serverSorting: true,
            batch: true,
            pageSize: 3,
            schema: {
                data: "data",
                total: "Total",
                model: { // define the model of the data source. Required for validation and property types.
                    id: "Id",
                    fields: {
                        PurchaseID: { editable: false, nullable: true },
                        PurchasePrice: { nullable: true },
                        PurchaseQuantity: { validation: { required: true, min: 1 } },
                        SaleRate: { validation: { required: true, min: 1 } },
                        Amount: { type: "number", editable: false },
                        Products: {
                            nullable: false,
                            validation: { required: true},
                            defaultValue: {ProductID:1, ProductName:"Googo" },
                            //from: "Products.ProductName",
                            parse: function (data) {
                                debugger;
                                if (data == null) {
                                    data = { ProductID: 1};
                                }
                                return data;
                            },
                            type: "object"
                        }


                    }
                }
            },
            batch: true, // enable batch editing - changes will be saved when the user clicks the "Save changes" button
            change: function (e) {
                debugger;
                if (e.action === "itemchange" && e.field !== "Amount") {
                    var model = e.items[0],
                        type = model.Type,
                        currentValue = model.PurchasePrice * model.PurchaseQuantity;//formulas[type](model);
                    if (currentValue !== model.Amount) {
                        model.Amount = currentValue;
                        $("#grid").find("tr[data-uid='" + model.uid + "'] td:eq(4)").text(currentValue);
                    }

                    //if (e.field == "Products") {
                    //    $("#grid").find("tr[data-uid='" + model.uid + "'] td:eq(0)").text(model.Products);
                    //}
                }
            },
            transport: {
                read: {
                    url: "@Url.Action("Read", "Purchase")", //specify the URL which should return the records. This is the Read method of the HomeController.
                    contentType: "application/json",
                    type: "POST", //use HTTP POST request as by default GET is not allowed by ASP.NET MVC
                },
                parameterMap: function (data, operation) {
                    debugger;

                    if (operation != "read") {
                        // post the products so the ASP.NET DefaultModelBinder will understand them:

                       // data.models[0].ProductID = data.models[0].Product.ProductID;

                        var result = {};

                       // data.models[0].ProductID = $("#ProductDropDown").val();

                        for (var i = 0; i < data.models.length; i++) {
                            var purchase = data.models[i];

                            for (var member in purchase) {
                                result["purchaseDetail[" + i + "]." + member] = purchase[member];
                            }
                        }

                        return result;
                    } else {
                        var purchaseID = $("#hdnPurchaseId").val();
                        //output = '{ purchaseID: ' + purchaseID +  '}';
                        data.purchaseID = purchaseID; // Got value from MVC view model.
                        return JSON.stringify(data)
                    }
                }
            }
        },



    }).data("kendoGrid");