jqGrid，禁用编辑行

Question

在我们的应用程序中，用户可以同时编辑多行。当他单击“保存”按钮时，所有行都将一一保存到数据库中。

我遇到的问题是，当用户填写错误的内容（例如跳过必填字段）时，我想从那里取消保存，并且用户应该能够更正错误。

我的解决方案中缺少的是，我不知道如何在成功保存行后将处于编辑模式的行禁用为原始状态。如果我执行 RestoreRow，则会显示编辑前的旧值。

我的代码（我将 jqGrid 保存在名为 grid 的变量中）：

    function saveGrid() {
        var saveCollection = [];
        //Collect all rows in editmode, the rows to be saved.
        $.each(grid.getDataIDs(), function (index, id) {
            var row = grid.getInd(id, true);
            if (row !== false) {
                if ($(row).attr('editable') === '1') {
                    saveCollection.push(id);
                }
            }
        });

        //Function to save single row.
        function saveSingleRow(rowId) {
            var success = false;
            grid.saveRow(rowId, function () {
                //Row successfully saved.
                success = true;

                //Here I want to restore the row somehow but not with the old values.
            });

            //If everything worked out, save next row if there are any left.
            if (success) {
                saveCollection = $.grep(saveCollection, function (obj) {
                    return obj !== rowId;
                });

                if (saveCollection.length > 0) {
                    return saveSingleRow(saveCollection[0]);
                }
            }

            //If error or the last row, return success status.
            return success;
        }

        //Check if there are any rows in editmode, then begin to save each row.
        if (saveCollection.length > 0) {
            if (!saveSingleRow(saveCollection[0])) {
                //If something went wrong during saving cancel and return from this function.
                return;
            }
        }
        //Every row was successfully saved. Reload grid.
        grid.trigger('reloadGrid');
    }

如您所见，一旦发生错误，是来自服务器还是验证错误，保存过程将停止并返回 false。但是，如果这种情况发生在第四行，那么第一行到第三行已经成功保存，但仍处于编辑模式。然后用户会感觉这些行没有被保存。

这就是我打开行进行编辑（内联编辑）的方式。当用户点击工具栏中的编辑按钮时就会发生这种情况：

var rows = $.grep(grid.getGridParam('selarrrow'), function () { return true; });
if (rows !== null && rows.length > 0) {
    $.each(rows, function (i1, gr) {
        if (gr !== null) {
           grid.editRow(gr, false);
        }
    });
}

那么是否有一种“反编辑”功能呢？我现在无法想出更好的主要解决方案。有没有办法在开始保存过程之前检查是否存在任何验证错误？然后我可以检查这一点，然后将所有行发送到服务器并将它们保存在事务中。

感谢任何帮助！谢谢。

已更新 解决方案是没有保存后再次锁定行的函数。当保存成功时，这应该自动完成。在这种情况下，问题在于，当添加保存成功返回客户端后运行的回调函数时，您必须返回 true 才能发生这种情况。 所以这就是所缺少的（底部的语句：return true;）：

grid.saveRow(rowId, function () {
                //Row successfully saved.
                success = true;

                //Here I want to restore the row somehow but not with the old values.
                return true;
            });

Answer 1

在我看来，您应该在成功保存更改后将“not-editable-row”类添加到行（ 元素）。请参阅答案详细信息和演示。

更新基于评论的讨论：您所描述的内容表明，在您的演示中保存行的工作不正确。成功保存后 saveRow 关闭< /strong> 已保存行的编辑模式。我创建了 演示 ，它执行您所描述的操作，但使用本地仅编辑。如果将数据保存在服务器上，所有这些都应该以完全相同的方式工作。

在评论中您写道“如果另一个用户当前在另一台计算机上处​​于编辑模式，则网格将被锁定以进行编辑”。在我看来，对于 Web 应用程序，锁定数据库中的数据是一种不好的做法。如果与客户端的连接中断或发生其他错误，您可以轻松锁定数据库中的数据并且没有客户端连接。通常使用乐观并发控制来代替。请参阅此处和此处了解详细信息。