Question

我正在使用初始数据填充jqGrid。那么我想要完成的是用户应该能够编辑，插入和删除行。用户完成后，他应该单击一个保存按钮，该按钮应该将更改的数据发送到服务器以更新数据库。

我已将网格设置为cellsubmit：“clientArray”，并使用$（“＃dagbok_grid”）获取更改的行.getChangedCells（'all'）。它似乎工作。当我添加行时，我给它们的id为-1，所以我知道哪些是新的。

当我尝试使用jqGrid（“delGridRow”，rowid）实现删除时，似乎总是想要发布到服务器。有没有办法在本地进行删除，然后将其与所有其他更改一起发送？

Answer 1

要从网格中删除行，您可以使用delRowData，但在某些技巧之后也可以使用delGridRow。在the answer我发布了演示文稿，其中显示了如何实施本地表单编辑。该解决方案的主要思想是使用processing: true设置。您可以通过添加其他选项delGridRow来删除与$("#dagbok_grid").jqGrid("delGridRow", rowid, delSettings)相关的本地数据，其中delSettings可以定义如下：

var delSettings = {
        afterShowForm: function ($form) {
            var form = $form.parent()[0], dialog;
            // delete button: "#dData", cancel button: "#eData"
            $("#dData", form).attr("tabindex", "1000");
            $("#eData", form).attr("tabindex", "1001");
            setTimeout(function () {
                // set "Delete" button as default, so one can
                // confirm deliting by pressing "Enter" key
                $("#dData", form).focus();
            }, 50);
            dialog = $form.parent().parent();
            dialog.position({
                my: "center",
                //at: 'center center',
                of: grid.closest('div.ui-jqgrid')
            });
        },
        // because I use "local" data I don't want to send the changes to the server
        // so I use "processing:true" setting and delete the row manually in onclickSubmit
        onclickSubmit: function (options) {
            var gridId = $(options.gbox).attr("id").substr(5),
                gridIdSelector = $.jgrid.jqID(gridId),
                $grid = $("#" + gridIdSelector);
                p = $grid[0].p, // jqGrid parameters
                newPage = p.page,
                rowids = p.multiselect ? p.selarrrow : [p.selrow];

            // reset the value of processing option to true
            // because the value can be changed by jqGrid
            options.processing = true;

            // delete the row
            $.each(rowids, function () {
                $grid.jqGrid('delRowData', this);
            });
            $.jgrid.hideModal("#delmod" + gridIdSelector,
                                { gb: options.gbox,
                                    jqm: options.jqModal,
                                    onClose: options.onClose });

            if (p.lastpage > 1) {// on the multipage grid reload the grid
                if (p.reccount === 0 && newPage === p.lastpage) {
                    // if after deliting there are no rows on the current page
                    // which is the last page of the grid
                    newPage -= 1; // go to the previous page
                }
                // reload grid to make the row from the next page visable.
                $grid.trigger("reloadGrid", [{page: newPage}]);
            }

            return true;
        },
        processing: true
    };

我会警告您从服务器获取的数据批量修改中的问题。您可能遇到的问题是并发错误。换句话说，如果两个人编辑相同的信息。用户可以先加载信息并稍后编辑信息，而无需从服务器刷新网格。在另一个用户可以修改部分信息的时候。检测此类错误并非易事，但创建良好的错误消息则更为复杂。如果用户必须再次进行所有修改，则会使您的程序用户非常生气。有关详细信息，请参阅here和here。

在客户端的jqGrid中编辑数据，然后将批量发送到服务器？

1 个答案: