jqgrid - 添加新行并禁用restoreRow功能

如果我要添加新行并且启用自动编辑新添加的行，那么我想执行验证并通过 ENTER 按钮保存行，但我不想通过 ESC 按钮恢复行。因为我设置了required: true按所有字段，如果新添加的行将至少有一个字段为空，则按 ESC 按钮（restoreRow）导致我的数据不一致，因为不会执行验证并且新添加的行将具有空字段。虽然我设定了required: true.

问题是，添加新行后，我总是想在保存之前验证编辑的行，但 ESC 按钮会导致恢复行。对于 doubliClick 的正常编辑原因，我想使用 ESC 来恢复行，使用 ENTER 来保存行。

我的代码是从coffescript生成的

$("#add-row").click((function(_this) {
  return function(e) {
    e.preventDefault();
    return _this.saveEditingRow(function() {
      var dataIds;
      _this.table.jqGrid("addRowData", void 0, "last");
      dataIds = _this.table.jqGrid("getDataIDs");
      if (dataIds.length > 0) {
        return _this.table.jqGrid("editRow", dataIds[dataIds.length - 1], {
          keys: true,
          url: "clientArray",
          aftersavefunc: function(rowId) {
            return retypeColumnValues.call(table, rowId);
          }
        });
      }
    });
  };
})(this));


Table.prototype.saveEditingRow = function(successfunc, errorfunc) {
    var i, result, savedRows, success, _i, _ref;
    savedRows = this.table.jqGrid("getGridParam", "savedRow");
    success = true;
    for (i = _i = 0, _ref = savedRows.length; _i < _ref; i = _i += 1) {
      if (savedRows.length > 0) {
        result = this.table.jqGrid("saveRow", savedRows[i].id, {
          url: "clientArray"
        });
        if (!result && success) {
          success = false;
        }
      }
    }
    if (success) {
      return typeof successfunc === "function" ? successfunc() : void 0;
    } else {
      return typeof errorfunc === "function" ? errorfunc() : void 0;
    }
};

如果有必要，我会将所有代码填充到coffeescript中。

I agree that it's a problem because the option keys: true register keydown event handler which process both Enter and Esc. You can't just inform jqGrid to process Enter, but don't process Esc.

如果你不打电话restoreRow在你的代码中，那么你可能可以通过使用来解决你的问题beforeCancelRow您可以在其中定义回调$.jgrid.inlineEdit.

$.extend(true, $.jgrid.inlineEdit, {
    beforeCancelRow: function () { // the parameters options and rowid can be used
        return false;
    }
});

上面的代码将不允许restoreRow根本不。您可以通过包含一些验证来修改代码。

您还有一个选择：不使用keys: true，但是注册你自己的keydown所有处理程序<input> and <select>编辑行中的字段。你可以在以下位置执行此操作oneditfunc打回来。看源代码 https://github.com/tonytomov/jqGrid/blob/v4.7.0/js/grid.inlinedit.js#L112-L134 of keydownjqGrid 使用的处理程序。你只需要打电话saveRow的情况下e.keyCode === 13。所需rowid您可以从外部范围获取（如果您在oneditfunc）或从e.target: $(e.target).closest("tr.jqgrow").attr("id").

另一种选择：您可以添加一些类，例如jqgrid-new-row（这是使用的类addRow http://www.trirand.com/jqgridwiki/doku.php?id=wiki:inline_editing#addrow方法）到行（<tr>) 调用后直接addRowData ($("#" + dataIds[dataIds.length - 1]).addClass("jqgrid-new-row")）。你应该添加afterrestorefunc回调到editRow你称之为。里面的afterrestorefunc你可以测试该行是否有jqgrid-new-row上课和通话delRowData排在案件中。顺便说一句，如果你添加课程jqgrid-new-row名称（或使用addRow代替addRowData）然后删除取消的行将自动完成restoreRow (see 代码片段 https://github.com/tonytomov/jqGrid/blob/v4.7.0/js/grid.inlinedit.js#L422-L427).

您甚至可以无条件地执行此操作，无需对类进行任何测试jqgrid-new-row如果上面的代码有效only如果编辑新添加的行。所以调用editRow可能像下面这样

return _this.table.jqGrid("editRow", dataIds[dataIds.length - 1], {
    keys: true,
    url: "clientArray",
    aftersavefunc: function(rowId) {
        return retypeColumnValues.call(table, rowId);
    },
    afterrestorefunc: function(rowId) {
        _this.table.jqGrid("delRowData", rowId); // delete after cancel editing
    }
});