Question

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

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

我在解决方案中缺少的是，在成功保存行之后，我不知道如何在编辑模式下禁用行到原始状态。如果我执行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”类添加到行（<tr>元素）。有关详细信息和演示，请参阅the answer。

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

在你写的评论中“如果另一个用户当前在另一台计算机上处于编辑模式，网格将被锁定以进行编辑”。在Web应用程序的情况下，在我看来，数据库中的数据锁定是一种不好的做法。在断开与客户端的连接或发生其他错误的情况下，您可以轻松地在数据库中锁定数据并且不连接客户端。一个用途通常是optimistic concurrency control。有关详细信息，请参阅here和here。

jqGrid，禁用已编辑的行

1 个答案: