如何在 ondblClickRow 事件中触发 beforeSubmitCell 事件答案

【问题标题】：How to trigger beforeSubmitCell event inside ondblClickRow event如何在 ondblClickRow 事件中触发 beforeSubmitCell 事件
【发布时间】：2019-01-02 14:40:06
【问题描述】：

我有一个与 jqgrid v4.15.4 相关的问题。我使用 beforeSubmitCell 事件返回将发布到服务器的新数组。我还保留了选项 cellEdit: true ，cellsubmit: 'remote'。默认情况下，如果 jqGrid 单元格是可编辑的，单击该单元格会将其更改为编辑模式。我知道这可以通过 ondblClickRow 完成。但是如何在 ondblClickRow 事件函数中调用 beforeSubmitCell 事件。

对于参考，我已阅读：jQGrid Cell Editing on double click of row

如果需要更多信息，请告诉我？

【问题讨论】：

你看我的回答了吗？在 20 天内，我没有收到任何关于我的回答的反馈。
您好 Oleg，抱歉延迟回复，我最初检查了您的建议，但想使用不同的单元格类型（文本、下拉列表、日期）进行更多测试，因此无法分享我的观点。但现在我在下面的答案中做了。请检查。
对不起，但我不明白你的意思是“但现在我在下面的答案中做了。请检查。”你在哪里发布了一些额外的信息？通常，您应该单击问题文本下方的“编辑”链接来编辑文本。您可以在文本后面附加“已更新：...”，然后发布新评论以通知我文本中的更改。

标签： asp.net-mvc jqgrid free-jqgrid

【解决方案1】：

如果我正确理解您的问题，您应该不要使用选项cellEdit: true（但仍使用cellsubmit: 'remote'）并设置cellEdit: true动态在调用单元格编辑方法之前（editCell、restoreCell、saveCell、prevCell 或 nextCell）。此外，您将不得不复制键盘操作（请参阅免费 jqGrid 代码的the lines）。生成的代码可能如下所示：

ondblClickRow: function (rowid, iRow, iCol, e) {
    var $self = $(this), p = $self.jqGrid("getGridParam");
    p.cellEdit = true;
    $self.jqGrid("editCell", iRow, iCol, true);
    p.cellEdit = false;
},
afterEditCell: function (rowid, cmName, cellValue, iRow, iCol) {
    var getTdByColumnIndex = function (tr, iCol) {
            var $t = this, frozenRows = $t.grid.fbRows;

            tr = frozenRows != null && frozenRows[0].cells.length > iCol ?
                    frozenRows[tr.rowIndex] : tr;
            return tr != null && tr.cells != null ? $(tr.cells[iCol]) : $();
        },
        $td = getTdByColumnIndex.call(this, this.rows[iRow], iCol),
        $self = $(this),
        $t = this,
        p = $self.jqGrid("getGridParam");

    $("input, select, textarea", $td).on("keydown", function (e) {
        if (e.keyCode === 27) { //ESC
            p.cellEdit = true;
            $self.jqGrid("restoreCell", iRow, iCol);
            p.cellEdit = false;
        } else if (e.keyCode === 13 && !e.shiftKey) { //Enter
            p.cellEdit = true;
            $self.jqGrid("saveCell", iRow, iCol);
            p.cellEdit = false;
            return false;
        } else if (e.keyCode === 9) {
            if (!$t.grid.hDiv.loading) {
                p.cellEdit = true;
                if (e.shiftKey) {
                    $self.jqGrid("prevCell", iRow, iCol); //Shift TAb
                } else {
                    $self.jqGrid("nextCell", iRow, iCol); //Tab
                }
                p.cellEdit = false;
            } else {
                return false;
            }
        }
        e.stopPropagation();
    });
}

见https://jsfiddle.net/OlegKi/Lm7akxz2/

【讨论】：

嗨@Oleg，我已经按照你的建议实现了上面的代码，它可以很好地解决调试器（F10）通过 $ 行时出现的一个问题self.jqGrid("saveCell", iRow, iCol); .它说 URL 未设置。这可能是什么原因？
@Chandan：您没有发布您使用的代码。因此，我很难回答你的问题。我只能猜测。如果您使用cellsubmit: "remote"，那么您应该指定cellurl，修改后的单元格将被发布到该位置。你指定cellurl了吗？
@Chandan：如果您使用选项cellsubmit: "remote"，那么您希望 jqGrid 将修改后的数据发布到服务器，而不是仅在本地保存单元格编辑的更改。因此，如果您使用选项cellsubmit: "remote"，则必须始终指定cellurl。
@Chandan：您可以使用var p = $("#list").jqGrid("getGridParam"); p.cellurl= "newUrl";等代码动态设置cellurl值
@Chandan：或者你可以定义cellurl参数作为回调函数cellurl: function (currentCellurl, iRow, iCol, rowid, value, name) { return "dynamicUrl"; }。我看到当前代码使用currentCellurl 作为第一个参数。我将在下一版本的免费 jqGrid 中删除它。回调函数原型将固定为cellurl: function (iRow, iCol, rowid, value, name) { return "dynamicUrl"; }