Question

我的Kendo Grid有一个自定义弹出式编辑器模板，其中包含选项卡。其中一个选项卡是有一个与正在编辑的记录相关的第二个Kendo Grid记录网格。

我希望能够创建新记录并立即开始添加相关记录，而无需重新打开新创建的记录。显然，我必须先保存记录才能生成ID。

我设法阻止弹出编辑器在保存新记录时关闭，但我认为弹出窗口此时不再绑定到模型。

有没有办法可以将窗口重新绑定到模型中，以便我可以继续编辑并添加相关记录？

由于

编辑：这是保持编辑器打开的技巧：

网格的编辑和保存事件：

edit: function(e){
  var editWindow = this.editable.element.data("kendoWindow");
  editWindow.bind("close", onWindowEditClose);
},
save: function(e){
    if (e.model.isNew()) {
        preventCloseOnSave = true;
    } else {
        preventCloseOnSave = false;
    }
}

onWindowEditClose：

var onWindowEditClose = function(e) {'
    if (preventCloseOnSave) {
        e.preventDefault();
        preventCloseOnSave = false;
    }
};

Answer 1

我最终使用了一个稍微笨重的解决方法，但除了一个小的UI'闪存'之外，它可以正常工作。

Grid有一个rowTemplate，所以我已经将记录的ID字段添加到TR标记中，因此我可以通过ID找到它们。然后我创建了一个在complete事件上运行的函数，当创建一个新记录时，它会找到新行并立即打开它：

var ds = new kendo.data.DataSource({
  // ...
  transport: {
    create:  {
      url: '/url/to/create',
      dataType: 'json',
      type: 'post',
      complete: recordCreated
  }
});

function recordCreated(e) {
  "use strict";
  var id = e.responseJSON.data[0].id,
  grid = $('#grid').data("kendoGrid"),
  row = grid.tbody.find("tr[data-id='" + id + "']");
  grid.editRow(row);
}

Answer 2

在概念层面，您可以拦截将记录保存到数据库的POST操作，并在返回时获取保存的数据。请注意，您的POST操作必须返回已保存的对象（按预期方式）。您可以使用支持网格的Kendo UI Datasource对象的requestEnd方法挂钩此事件，并将保存的记录绑定到编辑窗口（只要您有对它的引用）。

var ds = new kendo.data.DataSource({
  // ...
  requestEnd: function (e) {
    kendo.bind(editWindow, e.response);  // bind the returned data to your edit window
  }
});

Answer 3

对剑道ui结构的理解（有时可能很乏味）对于完成任何事情很重要。允许插入的弹出窗口的关闭是在dataBinding事件中完成的。因此，这是我们需要阻止它的地方：

        $("#yourgrid").kendoGrid({
        dataSource: yourDataSource,
        columns: [
            { field: "YouColumn", title: "YourTitle", ... },
            ...
            ]
            .
            .
            .               
        editable: "popup",
        dataBinding: function(e){
            //this is the key to keeping the popup open
            e.preventDefault();
        },
        save: function (e) {
           //whatever you need to do here
        }
        .
        .
        .
    });

希望这有助于某人。

//霍迪尼

Kendo Grid：保存新记录后保持自定义弹出窗口打开

3 个答案: