Question

是否有使用jqgrid的getChangedCells的示例确定数据是否已更改的方法？

我在可下载的演示中获取了getChangedCells jqgrid，只能找到函数定义，而不是 getChangedCells的示例用法。

我想要做的是保存用户的编辑内容如果用户点击另一行，则会生成。但是，我只是如果行是脏的，想要提交保存。

提前致谢， --Nate

Answer 1

行上没有安全脏标志。您可以使用以下事实：在行编辑开始时（在inline editing mode的开头），方法editRow将editable="1"属性添加到网格行（<tr>元素）。稍后，方法saveRow和restoreRow会将属性值更改为editable="0"。因此，在内联编辑模式下至少一次的当前页面的行将具有editable属性。如果表元素的id是“list”，则可以使用

查找已编辑的行

$("#list tr[editable]")

集合元素的id是行的rowid。

如果在网格中使用分页，则应该小心并在更改页面之前将编辑行的ID保存在当前页面上。 onPaging事件会对您有所帮助。

在我看来，最好和最安全的方法就是使用editRow或saveRow方法的aftersavefunc参数（可能只使用editRow {{3}} }}）。在aftersavefunc函数内部，您可以将修改后的行的ID保存在数组/映射中。这将解决您的问题，并将安全工作。

Answer 2

最后，我设法带了一段代码来检测我们想要的东西;）

希望那里的任何jqgrid大师（如Oleg）都有足够的时间来审查这些代码并对其进行改进。

示例代码适用于检测网格中更改的数据，其中包含名为“name”的可编辑字段。如果要检查更多列中的已更改数据，则必须添加与该列关联的变量after_edit和before_edit。

要获取onSelectRow函数中的前一个单元格数据，我没有使用getCell方法，因为在文档中用红色表示：

编辑行或时，请勿使用此方法细胞。这将返回单元格内容，而不是输入元素的实际值

耻辱我可以检查文件是否正确:(。但是getCell函数可以正常使用当前单元格数据。

以下是代码：

 // Declare variables used for inline edit functionality.
 var last_selected;
 var before_edit_value;
 var after_edit_value;
 $('#grid-id').jqGrid({
...

onSelectRow: function(row_id){
    if(row_id && row_id !== last_selected) {
        /*
         * Determine if the value was changed, if not there is no need to save to server.
         */
         if (typeof(last_selected) != 'undefined') {
            after_edit_value = $('#grid-id tr#' + last_selected + ' .name_column input').val();
         }

        if (before_edit_value != after_edit_value) {
            /*
             * Save row.
             */
            $('#grid-id').jqGrid(
                'saveRow', 
                last_selected, 
                function(response){
                    /* SuccessFunction: Do something with the server response */

                    return true;    
                }, 
                'http://url.to.server-side.script.com/server-side-script.php', 
                {
                    additional_data: 'example: additional string',
                });
            }
            else {
                /*
                 * Restore the row.
                 */
                $('#grid-id').jqGrid('restoreRow', last_selected);
            }

        before_edit_value   = $('#grid-id').jqGrid('getCell', row_id, 'name');
    }   

    last_selected       = row_id;

    /*
     * Edit row.
     */
    $('#grid-id').jqGrid(
        'editRow', 
        row_id, 
        true, 
        function() {/* OnEditFunction */}, 
        function(response) {
        /* SuccessFunction: Do something with the server response */

        return true;

    }, 
    'http://url.to.server-side.script.com/server-side-script.php', 
    {
        additional_data: 'example: additional string',
    }); 
   },
...
});

Answer 3

在我的一个项目中，我做了以下操作：在编辑行之前，我记得全局变量中的行数据，编辑完成后，只需检查行数据是否已更改。这样的事情（通过双击激活编辑模式）：

var beforeEditData;



function onGridDblClickRow(id) {
  if (isRowEditable(id)) {
    beforeEditData = grid.getRowData(id);
    grid.editRow(id, true, null, null, 'clientArray', null, onRowAfterEdit);
    ...
  }
}
function onRowAfterEdit(row) {
  var data = grid.getRowData(row);
  if (!isDataChanged(beforeEditData, data)) {        
    return; // No changes
  }
  ... // Save data here
}
function isDataChanged(before, after){
  ... // Allows tricky logic for dirty data, e.g. one may trim spaces etc.
}

function onGridDblClickRow(id) { if (isRowEditable(id)) { beforeEditData = grid.getRowData(id); grid.editRow(id, true, null, null, 'clientArray', null, onRowAfterEdit); ... } } function onRowAfterEdit(row) { var data = grid.getRowData(row); if (!isDataChanged(beforeEditData, data)) { return; // No changes } ... // Save data here } function isDataChanged(before, after){ ... // Allows tricky logic for dirty data, e.g. one may trim spaces etc. }

Answer 4

使用MVC4和JQuery这就是我所做的

在视图中

<script type="text/javascript">

var $grid = $("#Grid");
var lastSelection;
var datachanged = false;

function gridInitialised() {
    var headers = $('th>div>:input');
    for (var h = 0; h < headers.length; headers[h++].onclick = (function () { if (datachanged) { $grid.saveRow(lastSelection); datachanged = false; } }));
}

function editRow(id) {
    if (id && id !== lastSelection) {
        if (datachanged) { $grid.saveRow(lastSelection); datachanged = false; }
        $grid.restoreRow(lastSelection);
        $grid.editRow(id, true);
        var inputs = $('#'+id+'>td>:input[class="editable"]');
        for (var i = 0; i < inputs.length; inputs[i++].onchange = (function () { datachanged = true; }));
        lastSelection = id;
    }
}
</script>

@Html.Trirand().JQGrid(Model.Grid, "Grid")

模型中的

            Grid.ClientSideEvents.RowSelect = "editRow";
            Grid.ClientSideEvents.GridInitialized = "gridInitialised";

gridInitialised代码用于处理对搜索过滤器的更改。

戴夫

Answer 5

正如Oleg在5年前（哇）提到的那样 - 我使用了saveRow函数并将标记作为extraparam传递。

这样的事情，假设你的“模型”或我的案例中隐藏的列IsDirty：

onSelectRow: function(id) {
                if (id && id !== lastgridsel) {
                    $("#myGrid").saveRow(lastgridsel, false, "clientArray", { IsDirty: "True" });
                    $("#myGrid").editRow(id, true, null, null, "clientArray");
                    lastgridsel = id;
                }
            },

然后循环浏览Save click（我的情况下的外部按钮）上的行，这些内容符合以下几行：

$("#gridSaveBtn").on("click", function() {
            var batch = new Array();
            var dataIds = $("#myGrid").jqGrid("getDataIDs");
            for (var i = 0; i < dataIds.length; i++) {
                try {
                    $("#myGrid").jqGrid("saveRow", dataIds[i], false, "clientArray");
                    //get row data
                    var data = $("#myGrid").jqGrid("getRowData", dataIds[i]);
                    if (data["IsDirty"] === "True") {
                        batch.push(data);
                    }
                } catch (ex) {
                    alert(ex.Message);
                    $("#myGrid").jqGrid("restoreRow", dataIds[i]);
                }
            }
        });

jqGrid - 内联编辑 - 检测脏/更改的单元格

5 个答案: