如何在jqGrid中内联添加后更新列答案

【问题标题】：How to update column after inline add in jqGrid如何在jqGrid中内联添加后更新列
【发布时间】：2012-03-22 08:20:14
【问题描述】：

jqGrid 包含在 colmodel 中定义为的列

{"name":"_actions",
  "formatoptions":{"editbutton":true,"keys":true
  ,"delbutton":true
    } },

{ "name":"Kood","editable":true,"hidden":true}

按下工具栏中的内联添加按钮将新行添加到网格中。保存数据后，控制器返回新的 Kood 列值。这个新值应该分配给 Kood 列。

下面的代码显示了我尝试过的两种方法，但都失败了。好列的值不会改变

内联添加后如何更新列？如果使用保存操作按钮保存内联添加的行，如何更新列？

$grid.jqGrid('inlineNav', '#grid_toppager', {
  addParams: {
     addRowParams: {
            keys: true,
            // This is called if enter key is pressed to save added row
            aftersavefunc: afterSaveFuncAfterAdd,
        }
    },

  editParams: {
      keys: true,
      // This is called if saver button in toolbar is pressed on inline add
      aftersavefunc: afterSaveFuncAfterAdd,
    },
add: true,
edit: false,
save: true,
cancel: true
});

function afterSaveFuncAfterAdd(rowID, response ) {
  var json = $.parseJSON(response.responseText);
      postData = $grid.jqGrid('getGridParam', 'postData');
  // this shows correct value:
  alert(json.PrimaryKeyValues[0]);
  // attempt 1:
  $('#' + rowID + '_Kood').val(json.PrimaryKeyValues[0]);
  // attempt2:
  postData['Kood'] = json.PrimaryKeyValues[0];
  }

【问题讨论】：

您是使用loadonce: true 还是只使用服务器数据？
@Oleg：jqgrid 仅使用 json 远程数据。 loadonce: true 未使用。添加控制器还返回使用$tr.attr("id", json.Id) 正确设置的新行ID。但是无法设置列值。

标签： javascript jqgrid

【解决方案1】：

editRow 的回调aftersavefunc 将在编辑后调用。目前你会发现没有$('#' + rowID + '_Kood')。此外，postData 在内联编辑期间不会更改，因此$grid.jqGrid('getGridParam', 'postData') 不会为您提供任何有用的信息。

因此，我建议您将所需的所有数据作为editurl 的回复发回。例如服务器计算的具有默认值的列，如上次编辑时间戳，您可以回发。添加操作的响应应该额外包含服务器生成的id。收到服务器响应后，可以使用setRowData或setCell修改网格中的数据。

例如，你可以返回

{"Id": "DB_Id", "Kood": "new Kood value"}

从服务器作为对“添加”操作的响应并返回

{"Kood": "new Kood value"}

作为“编辑”操作的响应。在这种情况下afterSaveFuncAfterAdd的代码可以如下所示

var afterSaveFunc = function (rowId, response) {
    var data = $.parseJSON(response.responseText);
    if ($.isPlainObject(data) && typeof data.Kood !== "undefined") {
        if (typeof data.Id !== "undefined") {
            // if we have 'Id' column in the grid we have to update the column
            // together with the value of `Kood`
            $(this).jqGrid('setRowData', rowId, { Id: data.Id, Kood: data.Kood });
            // if we have no additional `Id` we can update the Kood column only with
            // the statement like below
            // $(this).jqGrid('setCell', rowId, 'Kood', data.Kood);

            // in case of "Add" operation we have to update the row Id
            $('#' + $.jgrid.jqID(rowId)).attr('id', data.Id);
        } else {
            $(this).jqGrid('setCell', rowId, 'Kood', data.Kood);
        }
    }
}

【讨论】：