JQGrid addRowData rowId始終為零

Question

我正在使用jqGrid 4.4.4V ，我有兩個網格，可以說grid1和grid2，當我從grid1向grid2添加多個行時，行ID的更新為0,1，...但是當我每個都添加單個行時id是從'0'開始的。所以，如果我多次這樣做，所有的rowId只會像'0'。 有什么方法可以使rowId始終保持唯一。

注意：數據不是手動添加到網格，而是從sql獲取。 以下是兩個網格的代碼。

網格1：

  $("#grid1").jqGrid({ url: "/.......some handler path", datatype: 'json', contentType: "application/json; charset-utf-8", mtype: 'Get', colNames: ['Val ID', 'Val Name', 'Description', 'Dept', 'Vam', 'Venue', 'Venue', 'Solution', 'Method', 'Type'], colModel: [ { name: 'valId', index: 'valId', hidden: true }, { name: 'valName', index: 'valName', formatter: Namefield, width: 400 }, { name: 'description', index: 'description', width: 300 }, { name: 'dep', index: 'dep', width: 300 }, { name: 'vam', index: 'vam', width: 300 }, { name: 'venueId', index: 'venueId', hidden: true }, { name: 'venue', index: 'venue', width: 250 }, { name: 'solution', index: 'solution', width: 400 }, { name: 'Method', index: 'Method', width: 300 }, { name: 'Type', index: 'Type', hidden: true }, ], pager: $('#pager'), key:true, rowNum: 10, rowList: [10, 20, 30, 40], height: '100%', viewrecords: true, caption: '', sortname: 'Val Name', sortorder: "desc", emptyrecords: 'No records to display', autowidth: true, multiselect: true, multiselectWidth: 50, jsonReader: { root: "rows", page: "page", total: "total", records: "records", repeatitems: false, Id: "0" } }); 

網格2：

  $("#grid2").jqGrid({ datatype: 'function', mtype: 'Post', colNames: ['Val ID', 'Val Name', 'Description', 'Dept', 'Vam', 'Venue ID', 'Venue', 'Solution', 'Method', 'Type'], colModel: [ { name: 'valId', index: 'valId', hidden: true }, { name: 'valName', index: 'valName', formatter: Namefield, width: 400 }, { name: 'description', index: 'description', width: 300 }, { name: 'dep', index: 'dep', width: 300 }, { name: 'vam', index: 'vam', width: 300 }, { name: 'venueId', index: 'venueId', hidden: true }, { name: 'venue', index: 'venue', width: 250 }, { name: 'solution', index: 'solution', width: 400 }, { name: 'Method', index: 'Method', width: 300 }, { name: 'Type', index: 'Type', hidden: true }, { name: 'delete', index: 'delete', width: 50, formatter: Close, align: 'center' } ], pager: $('#pager'), key:true, rowNum: 10, rowList: [10, 20, 30, 40], height: '100%', viewrecords: true, caption: '', sortname: 'Val Name', sortorder: "desc", emptyrecords: 'No records to display', autowidth: true, multiselect: true, multiselectWidth: 50, jsonReader: { root: "rows", page: "page", total: "total", records: "records", repeatitems: false, Id: "0" } }); 

我在下面使用add和del方法的地方，

  var selRowIdsArray = []; var myGrid = $("#grid1"); var SelectedGrid = $('#grid2'); //get no of selected rows count var selRowIds = $("#grid1").jqGrid('getGridParam', 'selarrrow'); if (selRowIds.length !== 0) { if (selRowIdsArray.length == 0) { selRowIdsArray.push.apply(selRowIdsArray, selRowIds); } for (i = 0; i < selRowIdsArray.length; i++) { selRowIdsInt = selRowIdsArray[i]; var selRowId = myGrid.getRowData(selRowIdsInt); SelectedGrid.jqGrid('addRowData', i, selRowId); myGrid.jqGrid('delRowData', selRowIdsInt); } } 

謝謝你的幫助。

Answer 1

如果您很好地了解了idPrefix rowid和idPrefix選項，則可以很輕松地解決您的問題。 它是相應HTML <table>的<tr>元素的id屬性的值，該屬性顯示數據。 jqGrid的內部實現是這樣，jqGrid 必須為網格的每一行分配id ，該行對應數據。 強烈建議在每個項目中包含唯一的id屬性。 它可以是數據庫中的本機ID，也可以是某些組合鍵，例如id1 + "_" + id2 ，其中包含有關后端本機ID的完整信息。 我建議您檢查文章中 的圖片 。

您可以將id放在任何其他名稱下作為id 。 如果您使用jsonReader repeatitems: false選項，並且valId是唯一ID的名稱，則應使用

jsonReader: { id: "valId" }

通知jqGrid。 像您一樣，不需要使用默認值包含jsonReader的任何其他屬性。 jsonReader其他任何屬性（例如Id （而不是id ））都將被忽略。 之后，您可以從網格中刪除不需要的隱藏列valId ，這會將相同的信息保存在網格的<td>元素中。

如果您使用網格編輯功能，我建議再添加一個選項

prmNames: { id: "valId" }

該選項將id屬性重命名，並在對網格進行編輯后發送給valId 。 因此，您可以繼續使用valId而不是id 。

接下來，您應該了解rowid不能與id（ valId ）相同。 如果頁面上有多個網格，則idPrefix建議使用idPrefix 。 使用的jqGrid的復古版本4.4.4（4歲的版本）也支持該功能。 例如，您可以在第一個網格中使用idPrefix: "g2_" ，在第二個網格中使用idPrefix: "g1_" 。 它可以防止 HTML頁面上的id重復 ，因為rowid將從具有相應id前綴的id（ valId ）構建，兩個網格都不相同。

在理解rowid的含義之后，應該清楚如何將選定的行從一個網格移動到另一個網格。 該聲明

var selRowIds = $("#grid1").jqGrid('getGridParam', 'selarrrow');
var idPrefix1 = $("#grid1").jqGrid('getGridParam', 'idPrefix');

為您提供所選行的rowid（具有第一個網格的idPrefix ）和您使用的前綴idPrefix1 。 您可以使用$.jgrid.stripPref刪除前綴，使用getRowData獲取行數據，並使用addRowData使用相同的ID將相同的數據添加到第二個網格中

var i, id, item;
for (i = 0; i < selRowIds.length; i++) {
    id = $.jgrid.stripPref(idPrefix1, selRowIds[i]);
    item = myGrid.jqGrid("getRowData", id);
    SelectedGrid.jqGrid("addRowData", id, item);
}

addRowData將自動使用第二個網格的idPrefix 。

最后，我建議您停止使用4.4.4的復古版本，該版本已經有很多年了。 我建議您使用免費jqGrid的當前版本（4.13.6）-它是jqGrid的分支，我從2014年底開始開發。如果您安裝了4.4.4，是因為使用了錯誤的NuGet包jQuery。 jqGrid ，那么您應該卸載該軟件包並安裝另一個軟件包： free-jqGrid 。