保存/提交时重新加载jqGrid
我有以下代码在双击时输入内联编辑：
ondblClickRow: function (row_id) { if(row_id != null) { $('#Products').jqGrid('restoreRow',last_selected_row); $('#Products').jqGrid('saveRow',row_id); $("#Products").jqGrid('editRow',row_id, true, null, function(){ $("#Products").trigger("reloadGrid", [{current: true}]); }, 'xtras/Products.php', null,{}, {},{} ); $("#Products_ilsave").removeClass('ui-state-disabled'); $("#Products_ilcancel").removeClass('ui-state-disabled'); $("#Products_ilcancel").removeClass('ui-state-disabled'); $("#Products_ilcopy").addClass('ui-state-disabled'); $("#Products_iladd").addClass('ui-state-disabled'); } } 和导航定义：
$("#Products").jqGrid("navGrid", "#Products_pager", {search: true, add: false, edit: false, del: true, refreshstate: "current"}, {}, {}, {}, {}, {sopt:['eq','ne','cn','bw','bn','ge','le','lt','gt'], multipleSearch:true, showQuery: false} ) .jqGrid("inlineNav", "#Products_pager", {add: true, edit: true}, ) .navButtonAdd('#Products_pager',{ caption:"", title:"Copy selected row", id:"Products_ilcopy", buttonicon:"ui-icon-copy", onClickButton: function(){ var srcrowid = $grid.jqGrid('getGridParam', 'selrow'); if (srcrowid > 0) { $('#Products_iladd').click(); var rowData = $('#Products').jqGrid('getRowData', srcrowid); rowData.ID = ''; rowData.Catalogue = ''; rowData.UPCEAN = ''; rowData.copyID = srcrowid; $grid.jqGrid('setRowData', 'new_row', rowData); var ondblClickRowHandler = $('#Products').jqGrid("getGridParam", "ondblClickRow"); ondblClickRowHandler.call($("#Products")[0], 'new_row'); } else { alert('Please select a row to copy'); return false; } }, position:"last" });
正如您所看到的，当我单击COPY按钮时，会创建一个新行并ondblClickRow以进行内联编辑。 如果我点击navGrid SAVE按钮 – 它会保存但不会重新加载。 如果我按下Enter键 – 它重新加载，但不保存任何东西。
请问如何保存并重新加载网格？
————– UPDATE ———————
添加，编辑，删除，复制 – 所有相同的url – ‘xtras / Products.php’
url:'xtras/Products.php', editurl:'xtras/Products.php', datatype: "json", mtype:'GET',
$（’＃Products’） – 是页面上唯一的网格
使用 – jqGrid 4.4.2
当前代码中的主要问题如下： 仅使用reloadGrid 为 reloadGrid 的一次直接调用指定回调。 另一方面，你使用inlineNav ，它有另外两个 editRow调用：一个单击Edit按钮，另一个单击Add按钮。 在这种情况下，您将无法重新加载网格。 “复制选定行”按钮的实现还存在一些其他问题。 所以我决定重写你使用的代码。 生成的代码可能如下所示
var editOptions = { keys: true, aftersavefunc: function() { var $self = $(this); setTimeout(function () { $self.trigger("reloadGrid", [{current: true}]); }, 50); }, url: "xtras/Products.php" }, gridIdSelector = "#Products", pagerIdSelector = "#Products_pager", $grid = $(gridIdSelector); $.extend($.jgrid.search, { sopt: ["eq", "ne", "cn", "bw", "bn", "ge", "le", "lt", "gt"], multipleSearch: true }); // create the grid $grid.jqGrid({ ... pager: pagerIdSelector, ondblClickRow: function (rowid) { var $self = $(this), savedRows = $self.jqGrid("getGridParam", "savedRow"); if (savedRows.length > 0 && savedRows[0].id !== rowid) { // cancel editing of another row is editing // don't cancel on double click on the current editing $self.jqGrid("restoreRow", savedRows[0].id); } if (savedRows.length === 0) { $self.jqGrid("editRow", rowid, editOptions); } } }) .jqGrid("navGrid", pagerIdSelector, {add: false, edit: false, refreshstate: "current"}) .jqGrid("inlineNav", pagerIdSelector, { editParams: editOptions, addParams: {addRowParams: editOptions}}) .jqGrid("navButtonAdd", pagerIdSelector, { caption: "", title: "Copy selected row", id: $grid[0].id + "_ilcopy", buttonicon: "ui-icon-copy", onClickButton: function () { var $self = $(this), p = $self.jqGrid("getGridParam"), rowData, srcrowid = p.selrow, savedRows = p.savedRow; if (srcrowid !== null) { if (savedRows.length > 0) { // cancel editing $self.jqGrid("restoreRow", savedRows[0].id); } rowData = $self.jqGrid("getRowData", srcrowid); rowData.ID = ""; rowData.Catalogue = ""; rowData.UPCEAN = ""; rowData.copyID = srcrowid; $self.jqGrid("addRow", { initdata: rowData, addRowParams: editOptions }); } else { alert("Please select a row to copy"); return false; } } }); // Enable/disable buttons on start/end of editing $grid.bind("jqGridInlineEditRow jqGridInlineAfterSaveRow jqGridInlineAfterRestoreRow", function () { var $self = $(this), savedRows = $self.jqGrid("getGridParam", "savedRow"); if (savedRows.length > 0) { // some row is editing now $(gridIdSelector + "_ilsave," + gridIdSelector + "_ilcancel").removeClass("ui-state-disabled"); $(gridIdSelector + "_ilcopy," + gridIdSelector + "_iladd," + gridIdSelector + "_iledit").addClass("ui-state-disabled"); } else { // No row is editing now $(gridIdSelector + "_ilsave," + gridIdSelector + "_ilcancel").addClass("ui-state-disabled"); $(gridIdSelector + "_ilcopy," + gridIdSelector + "_iladd," + gridIdSelector + "_iledit").removeClass("ui-state-disabled"); } });
您可以看到我定义了一个对象 editOptions ，我稍后将其用作所有情况的editRow选项。 另外，我使用savedRow参数，该参数包含有关当前编辑（关于内联或单元格编辑）行的信息。 如果savedRow为空数组，则现在不编辑任何行。 如果它不为空，则数组项的id属性包含编辑行的rowid。 我在“复制选定行”按钮的onClick处理程序中另外直接调用addRow方法。