Kendo UI自定义网格弹出编辑器窗口仅打开一次

我想使用自定义窗口作为Kendo UI Grid的弹出编辑器。 其内容将与搜索字段和显示搜索结果的网格相结合。 要做到这一点，我不想使用Kendo模板机制，而是一个真正的弹出窗口。

在使用自定义编辑器进行测试时遇到了一个问题。 即使有一个非常基本和简单的场景（只是create命令），我只能打开一次编辑器。 第二次出现错误时，编辑器不再出现，网格变空。

这是我的HTML代码：

JavaScript部分：

 function openCustomWindow(e) { e.preventDefault(); myWindow.center().open(); } function editorWindowClosed(e) { myGrid.cancelRow(); } var myWindow = $("#custom-window").kendoWindow({ modal: true, resizable: false, title: "Test", visible: false, close: editorWindowClosed }).data("kendoWindow"); var dummyDataSource = new kendo.data.DataSource( { schema : { model : { id: "id", fields: { postion: { type: "number"}, name: { type: "string"}, } } } }); dummyDataSource.add({postion: 1, name: "gswin"}); var myGrid = $("#my-table-grid").kendoGrid({ dataSource: dummyDataSource, toolbar: [ { name: "create", text: "Create" } ], editable: { mode: "popup", window: { animation: false, open: openCustomWindow, } }, columns: [ { field: "postion", title: "Postion" }, { field: "name", title: "Name" } ] }).data("kendoGrid"); 

JavaScript控制台中的错误消息：

未捕获的TypeError：无法读取undefinedut.ui.DataBoundWidget.extend.cancelRow @ kendo.all.min.js的属性’uid’：29ut.ui.DataBoundWidget.extend.addRow @ kendo.all.min.js：29（匿名函数） ）@ kendo.all.min.js：29jQuery.event.dispatch @jquery-2.1.3.js：4430jQuery.event.add.elemData.handle @jquery-2.1.3.js：4116

最后是一个jsfiddle链接来展示我正在做的事情。 （弹出窗口是空的，因为我只想在进一步操作之前修复打开/关闭机制）

我不明白为什么我会收到这个错误，我希望能够在我想要的时间内打开/关闭弹出窗口。 默认编辑器弹出窗口正常工作。

Answer 1

我的一位同事找到了解决方案（感谢他）。

其实这段代码

  editable: { mode: "popup", window: { animation: false, open: openCustomWindow, } } 

旨在配置默认弹出窗口…

使用自定义弹出窗口的正确方法如下：

  editable :true, edit: openCustomWindow, 

使用这种方法，它也更好用

 function editorWindowClosed(e) { myGrid.cancelChanges(); } 

代替

 function editorWindowClosed(e) { myGrid.cancelRow(); } 

工作jsfiddle链接

Answer 2

实际上，我之前的答案中的方法解决了我的问题，但却引发了另一个问题。 网格变为可编辑但处于默认模式（“内联”）。

这样做

 editable: "popup", edit: openCustomWindow 

修复了另一个问题，但现在显示2个弹出窗口。

我终于成功隐藏了默认弹出窗口并仅显示我的自定义弹出窗口，但它以最初问题中描述的原始问题结束…

考虑到所有这些信息，我得出结论，使用自定义弹出窗口绝对不是一个选项。 我将开始使用teamplates。

另一种解决方案是使用模板使用自定义“添加”按钮覆盖工具栏，并使用自定义命令进行编辑。 但在这一点上，我认为这太“棘手”了。