從jqGrid單元中取回數據的最佳方法是什么？

Question

我對jqGrid相當陌生，需要從單元中獲取數據進行編輯，並且希望避免訪問服務器。

由於自定義格式化程序會向數據添加額外的標簽，並且只需使用getCell返回所有標簽，因此我的第一個實現是“手動”剝離然后剝離：

createColumn: function (val, options) {
    return '<div style="white-space:pre-wrap">' // etc.
        + val
        + '</div>';
}
// ...
// Note: rowId is known at this point
var myData = $('#myGrid').jqGrid('getCell',rowId,'myData');
var myDataWrapper = mydata.createColumn('');
data = data.substr(myDataWrapper.length-6,data.length-myDataWrapper.length);

當然，如果有人添加更復雜的標簽，這將中斷。 因此，我研究了getCell實際查找數據的方式。 不幸的是，目前，它僅搜索名稱，因此代碼為：

var n = -1;
val colModel = $('#myGrid').jqGrid('getGridParam','colModel');
for (var i in colModel) {
    if (colModel[i].name === 'myData') {
    n = parseInt(i)+1;
}
var myData = $('#'+rowId+' td:nth-child('+n+') div').text();

在getCell復制代碼似乎是錯誤的，但是似乎沒有其他方法可以從名稱中查找列號（至少，我找不到它！）。 與第一個版本一樣，這也假定數據包裝在單個div中。

查看生成的html，我注意到jqGrid實際上使用aria- aria-describedby （我從未見過）標記單元格。 如果保證始終存在，那么可以使用以下方法完成上述操作：

var myData = $('#'+rowId+' td:[aria-describedby=myGrid_myData] div').text();

但這仍然使用以下假設：數據被包裝在一個div ，當然，將來的jqGrid版本可能會更改或刪除此屬性。

因此，我然后嘗試了通過將數據包裝在一個span添加ID的簡單解決方案，這樣我就可以輕松找到它：

createColumn: function (val, options) {
    return '<div style="white-space:pre-wrap">' // etc.
        + '<span id="' + options.gid + '_' + options.rowId + '_' + options.colModel.name + '">' + val + '</span>'
        + '</div>';
}
// ...
var myData = $('#myGrid_'+rowId+'_MyData').text();

這似乎是最好的方法（因為我對此有完全的控制權），但是有沒有更好的方法來獲取最初傳遞給formatter函數的數據，這不會在將來升級到jqGrid時中斷，並且不會需要添加額外的標簽？

Answer 1

關於問題的第一部分：

由於自定義格式化程序會向數據添加額外的標簽，因此只需使用getCell即可返回所有標簽...

在沒有額外標簽的情況下獲取數據的標准方法是實現unformat函數。 從jqGrid文檔中：

如“預定義格式器”一章所述，所有預定義類型均與編輯模塊兼容。 這意味着將轉換數字，鏈接，電子郵件等，以便可以對其進行正確的編輯。 同樣，獲取數據的方法（如getRowData和getCell）也使用這種取消格式化的方法來獲取原始值。 問題是：如果我們使用自定義格式器函數並希望使用編輯或方法getRowData和getCell返回原始值，該怎么辦？

答案是：您可以使用自己的自定義取消格式器功能來執行此操作。 該函數可以在colModel中使用

例如：

jQuery("#grid_id").jqGrid({
...
   colModel: [ 
      ... 
      {name:'price', index:'price', width:60, align:"center", editable: true,
       formatter:imageFormat, 
       unformat:imageUnFormat},
      ...
   ]
...
});

function imageFormat( cellvalue, options, rowObject ){
    return '<img src="'+cellvalue+'" />';
}

function imageUnFormat( cellvalue, options, cell){
    return $('img', cell).attr('src');
}

有關完整的詳細信息，包括參數說明，請參見jqGrid文檔的Unformatting部分。