我在这里寻找如何在保存行后重新加载网格：
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:inline_editing
JQGrid setRowData After inline edit
The afterInsertRow : function(ids) method is not executing when I use gridview:true
所以我想出了这个解决方案：
onSelectRow: function (id) {
var tr;
if (id && id !== lastSel) {
if (typeof lastSel !== "undefined") {
grid.jqGrid('restoreRow', lastSel);
//this line doing the reload
grid.jqGrid('saveRow', id, true, '', '', '', '', reloadGrid());
tr = grid[0].rows.namedItem(lastSel);
$("div.ui-inline-edit", tr).show();
$("div.ui-inline-save, div.ui-inline-cancel", tr).hide();
}
lastSel = id;
}
},
我正在使用动作格式化程序
{ name: 'act', index: 'act', width: 60, align: 'center', sortable: false, formatter: 'actions',
formatoptions: {
keys: true, // we want use [Enter] key to save the row and [Esc] to cancel editing.
delOptions: myDelOptions,
afterSave: hideDelIcon,
afterRestore: hideDelIcon
}
}
网格属性
rowNum: 10000,
gridview: true,
rownumbers: true,
ignoreCase: true,
viewrecords: true,
sortorder: "desc",
height: "100%",
editurl: '/Admin/Edit/',
grouping: true,
groupingView: {
groupField: ['race'],
groupColumnShow: [false],
groupText: ['<b class="selection-race">{0}</b>'],
groupDataSorted: true
},
ondblClickRow: function (id, ri, ci) {
var tr;
// edit the row and save it on press "enter" key
grid.jqGrid('editRow', id, true, null, null);
tr = grid[0].rows.namedItem(lastSel);
//$("div.ui-inline-edit, div.ui-inline-del", tr).hide();
$("div.ui-inline-edit", tr).hide();
$("div.ui-inline-save, div.ui-inline-cancel", tr).show();
},
onSelectRow: function (id) {
var tr;
if (id && id !== lastSel) {
// cancel editing of the previous selected row if it was in editing state.
// jqGrid hold intern savedRow array inside of jqGrid object,
// so it is safe to call restoreRow method with any id parameter
// if jqGrid not in editing state
if (typeof lastSel !== "undefined") {
grid.jqGrid('restoreRow', lastSel);
grid.jqGrid('saveRow', id, true, '', '', '', '', reloadGrid());
tr = grid[0].rows.namedItem(lastSel);
//$("div.ui-inline-edit, div.ui-inline-del", tr).show();
$("div.ui-inline-edit", tr).show();
$("div.ui-inline-save, div.ui-inline-cancel", tr).hide();
}
lastSel = id;
}
},
loadComplete: function () {
$(this).find("div.ui-inline-del").hide();
var ids = jQuery("#Grid1").getDataIDs();
for (var i = 0; i < ids.length; i++) {
var cl = ids[i];
$("tr#" + $.jgrid.jqID(cl)).prev().children().find("span.ui-icon-circlesmall-minus").hide();
}
var mids = jQuery("#Grid1").getDataIDs();
for (var i = 0; i < mids.length; i = i + 1) {
var cl2 = jQuery.jgrid.jqID(mids[i]);
var rowData = $("#Grid1").getRowData(cl2);
if (rowData.isonline == 'false') {
var trElement = jQuery("#" + cl2, jQuery('#sGrid1'));
trElement.removeClass('ui-widget-content');
trElement.addClass('not-approved');
}
}
$(".rowCount").text($("#Grid1").getGridParam("reccount"))
},
beforeRequest: function () {
$('#Grid1').setGridWidth(903, true);
}
}).jqGrid('navGrid', '#Pager1', { add: false, edit: false, del: false }, {}, {}, myDelOptions, { multipleSearch: true, overlay: false });
预定义函数
var lastSel, rowdata,
grid = $("#Grid1"),
getColumnIndexByName = function (grid, columnName) {
var cm = grid.jqGrid('getGridParam', 'colModel'), i = 0, l = cm.length;
for (; i < l; i += 1) {
if (cm[i].name === columnName) {
return i; // return the index
}
}
return -1;
},
myDelOptions = {
processing: false,
mtype: "POST", reloadAfterSubmit: true, //delData: { name: rowdata.name, isgood: rowdata.isgood }
serializeDelData: function (postdata) {
//var rowdata = jQuery('#Grid1').getRowData(postdata.id);
// append postdata with any information
return { id: postdata.id, uploadinfoid: postdata.uploadinfoid, oper: postdata.oper, name: rowdata.name, isfast: rowdata.isfast, isgood: rowdata.isgood, isdead: rowdata.isdead, isslow: rowdata.isslow, isheavy: rowdata.isheavy, isonline: rowdata.isonline };
},
// 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 (rp_ge, rowid) {
rowdata = jQuery('#Grid1').getRowData(rowid);
// we can use onclickSubmit function as "onclick" on "Delete" button
// delete row
grid.delRowData(rowid);
$("#delmod" + grid[0].id).hide();
if (grid[0].p.lastpage > 1) {
// reload grid to make the row from the next page visable.
// TODO: deleting the last row from the last page which number is higher as 1
grid.trigger("reloadGrid", [{ page: grid[0].p.page}]);
}
return true;
}
},
hideDelIcon = function (rowid) {
setTimeout(function () {
$("tr#" + $.jgrid.jqID(rowid) + " div.ui-inline-del").hide();
}, 50);
},
reloadGrid = function (rowid, result) {
$("#Grid1").trigger("reloadGrid");
};
它正在工作，但问题是，每次点击行后网格都会重新加载，而不是在点击保存按钮后重新加载。这是不正确的行为，因为没有理由处理不合理的服务器请求并在每行点击时重新加载网格。
我怎么能改变这种行为？我只想在保存按钮点击时重新加载网格。
答案 0 :(得分：2)
在我看来，您应该在$("#Grid1").trigger("reloadGrid");函数中包含$("#Grid1").trigger("reloadGrid",[{current:true}]);或hideDelIcon：
hideDelIcon = function (rowid) {
setTimeout(function () {
$("tr#" + $.jgrid.jqID(rowid) + " div.ui-inline-del").hide();
// the next line should be added
$("#Grid1").trigger("reloadGrid",[{current:true}]);
}, 50);
}