javascript - 剑道网格错误 - grid.select 不是函数，为什么？

Question

我的网格中有一个 kendoDropDown 列表作为单元格。我使用 kendo grid 的编辑器命令(“编辑器”)调用 kendDropDownList。我需要将所选行的所选值作为参数传递给 kendoDropDownList ，以便服务器仅使用过滤后的列表作为我的 kendoDropDownList 进行回复。请看我下面的例子

                         var grid =  $("#grid").kendoGrid({
                    dataSource: dataSource,
                    pageable: true,
                    columnMenu:true,
                    filterable:true,
                    height: 550,
                    reorderable: true,
            columnReorder: function(e) {
                        console.log(e.column.field, e.newIndex, e.oldIndex);
                      },
                    toolbar: ["create","excel","save", "cancel" , { template: kendo.template($("#template").html()) } , { template: kendo.template($("#clearFilterTemplate").html()) } , { name: "create", text: "Add New Employee" }],
                    excel: {
                            fileName: "Kendo UI Grid Export.xlsx",
                            proxyURL: "excelExport",
                            filterable: true,
                            allPages: true
                        },                        
                     editable: "inline" , //editable: true,
                     columns: [
                                { field: "fileNo" , title:"File No" , width: 80 },
                                { field: "jobNo" , title:"Job No" , width: 80 },
                                { field: "discipline" , title:"Discipline" , width: 80 },
                                { field: "moduleNo" ,title:"Module", width: 100},
                                { field: "description",title:"Title",editor: descriptionDropDownEditor, width: 150},
                                { field: "documentNo",title:"Document No", width: 150 },
                                { field: "remarks",title:"Remarks" , width: 150 } ,
                                { command: ["edit","destroy"], title: " ", width: "250px" }

                            ]


                });


                function descriptionDropDownEditor(container, options) {

                 // here is the error grid.select is not a function why ?
                 var selectedItem = grid.dataItem(grid.select());
                 var selectedJobNo = selectedItem.jobNo ;
                 alert("selectedJobNo :"+selectedJobNo  );


                $('<input required name="' + options.field + '"/>')
                    .appendTo(container)
                    .kendoDropDownList({
                        autoBind: false,
                        dataTextField: "text",
                        dataValueField: "value",
                        filter: "contains",
                        dataSource: {
                            dataType: "json",                                 
                            transport: {
                                // I need to pass the selected jobNo in order to get the only aprropriate descrption for that jobNo
                                // each row job has description and I don't want to show all the description for all jobs , I need only for that row jobNo

                                 read: "getDescriptionForEachDocumentIndex?selectedJobNo"+selectedJobNo 
                            }
                        }
                          });
                }

一旦网格行处于编辑模式，我需要将选定的行 jobNo 传递给 kendoDropDownList 以便仅返回该 jobNo 的相关描述。问题是我无法在编辑模式下调用 grid 并使用函数 grid.select() 。在这种情况下该怎么办？

Answer 1

嗯，这很容易。编辑器函数的第二个参数有一个名为 model 的属性，它是用户正在编辑的当前行的 dataItem。因此，就您而言，我认为这会起作用:

function descriptionDropDownEditor(container, options) {
    var selectedItem = options.model;

但是，要回答您的问题，您无法访问 select() 方法，因为 grid 不是 Kendo Grid 对象，它实际上是 #grid 元素。您可以在小部件初始化末尾添加 .data("kendoGrid"):

$("#grid").kendoGrid({ ... }).data("kendoGrid");

或者在函数内部调用:

function descriptionDropDownEditor(container, options) {
    var gridWidget = $(grid).data("kendoGrid");
    var selectedItem = gridWidget.dataItem(gridWidget.select());