保存内联按钮后，jQGrid重新加载网格 [英] jQGrid reload grid after save inline button click
本文介绍了保存内联按钮后，jQGrid重新加载网格的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我一直在这里寻找如何在保存行后重新加载网格:
I was looking here to find out how to reload grid after save row:
http://www.trirand.com/jqgridwiki/doku .php?id = wiki:inline_editing
afterInsertRow:函数(id)当我使用gridview:true
所以我想出了这个解决方案:
So i come up with this solution:
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;
}
},
我正在使用Actions格式化程序
I am using Actions formatter
{ 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");
};
这是可行的，但问题是，在单击行后每次都重新加载网格，但是在单击保存按钮后却没有重新加载网格.这是不正确的行为，因为没有理由处理不合理的服务器请求并在每次单击行时重新加载网格.
It is working but the problem is, grid getting reloaded every time after row clicked but not after save button clicked. It is not right behavior because there is no reason to process unreasonable server request and reload grid on each row click.
我该如何改变这种行为?我只想单击保存按钮就可以重新加载网格.
How may i change that behavior? I want to reload grid only on save button click.
推荐答案
在我看来，您应该在hideDelIcon函数中仅包含$("#Grid1").trigger("reloadGrid");或$("#Grid1").trigger("reloadGrid",[{current:true}]);:
It seems to me, that you should just include $("#Grid1").trigger("reloadGrid"); or $("#Grid1").trigger("reloadGrid",[{current:true}]); in the hideDelIcon function:
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);
}
这篇关于保存内联按钮后，jQGrid重新加载网格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
