jqGrid遍历网格中的数据子网格中的数据

Question

我想遍历所有包含在网格对象中的数据。 我的网格有一个定义，包括亚格对象，并创建这样

var grid = $(gridID); 
var pager = $(pagerID); 
grid.jqGrid({ 
    url: GetBaseWSUrl() + 'MyWs.asmx/MyMethod', 
    colNames: ['UMLT', 'FF', 'PC'], 
    colModel: [ 
      { name: 'Name', index: 'Name', width: 180, template: colTextTemplate }, 
      { name: 'AlertFF', index: 'AlertFF', width: 22, align: 'center', sortable: false, formatter: "checkbox", formatoptions: { disabled: false} }, 
      { name: 'AlertPC', index: 'AlertPC', width: 22, align: 'center', sortable: false, formatter: "checkbox", formatoptions: { disabled: false} } 
     ], 
    [...] 
    subGrid: true, 
    subGridOptions: { 
     "plusicon": "ui-icon-triangle-1-e", 
     "minusicon": "ui-icon-triangle-1-s", 
     "openicon": "ui-icon-arrowreturn-1-e", 
     "reloadOnExpand": true, 
     "selectOnExpand": true 
    }, 
    subGridRowExpanded: function (subgrid_id, row_id) { 
     var subgrid_table_id = subgrid_id + "_t"; 
     $("#" + subgrid_id).html("<table id='" + subgrid_table_id + "' class='scroll'></table>"); 
     $("#" + subgrid_table_id).jqGrid({ 
      [...] omitted for brevity 
     }); 
    } 
}); 

我知道我可以使用这样的代码一个迭代的数据，并有效地它为第一级，但我期待对于一个方法，这将允许我甚至在子网格数据上进行迭代。

var grid = $('#grid'); 
var m = grid.getDataIDs(); 
for (var i = 0; i < m.length; i++) { 
    var record = grid.getRowData(m[i]); 
    //do something with the record 
} 

有没有办法做到这一点？

Answer 1

好的。在the answer和this one我描述如何枚举网格行大多有效。如果你使用jQuery而不是使用DOM，那么你的代码可能会很奇怪。我收到了使用DOM元素是否安全的问题？改用jQuery不是更好吗？所以，我最终试图回答这些问题并解释为什么我认为这是最好的方式。如果您只对结果代码感兴趣，而不是解释中，则可以跳过我的答案部分。

主要思想是$('#grid')是一个jQuery封装到HTML DOM <table> object。表DOM对象（HTMLTableElement）$('#grid')[0]具有rows属性，它是网格行的集合：集合<tr> DOM元素（HTMLTableRowElement）。可以迭代每个索引的网格行：$('#grid')[0].rows[i]（以0开始）。如果知道rowid（<tr> element的ID），则可以获得相应的<tr>DOM对象，相对于$('#grid')[0].namedItem[rowid]。因此rows是具有cells属性的 DOM元素的集合。如果要检查网格第i行的第j列的包含，可以直接通过$('#grid')[0].rows[i].cells[j]获取<td>元素。如果只知道列名称，则可以检查colModel数组并搜索具有您需要的name属性的列。如果colModel数组中的索引为j，则可以使用$('#grid')[0].rows[i].cells[j]表达式中的索引。

重要的是，rows集合和namedItem方法是W3C标准的一部分（参见here和here）。所以它的真的很安全在那里使用。所有浏览器填入rows集合，并且所有浏览器都有本机代码（!!!），它们在rows集合中实现快速索引，并通过id（我的意思是namedItem方法）在集合中快速搜索。 jqGrid内部永久使用这些，这就是jqGrid快速工作的原因。 jQuery是使用内部DOM的JavaScript库。它可能不像原生浏览器代码那么快。在某些情况下，如位置或宽度的计算，有许多技巧可以在所有Web浏览器中正确获取信息，但使用HTML表格DOM是W3 standard，在此使用jQuery并不会带来任何好处。

在我的一些旧的答案中，我使用代码grid.getDataIDs()和id。现在我建议你按照the answer的代码。只有关于子网格和其他行的评论。

jqGrid有4种类型的<tr>元素，它有4个不同的类。因此，您可以检查<tr>元素的类，以确定该行是否包含子网格，分组标题，标准行或隐藏的第一行，用于设置列的宽度。

var grid = $('#grid')[0], rows = grid.rows, 
    cRows = rows.length, iRow, row, trClasses; 

    for (iRow = 0; iRow < cRows; iRow++) { 
     row = rows[iRow]; // row.id is the rowid 
     trClasses = row.className.split(' '); 
     if ($.inArray('jqgrow', trClasses) > 0) { 
      // the row is a standard row 
     } else if ($.inArray('ui-subgrid', trClasses) > 0) { 
      // the row contains subgrid (only if subGrid:true are used) 
     } else if ($.inArray('jqgroup', trClasses) > 0) { 
      // the row is grouping header (only if grouping:true are used) 
     } else if ($.inArray('jqfoot', trClasses) > 0) { 
      // the row is grouping summary (only if grouping:true are used) 
      // and groupSummary: [true] inside of groupingView setting 
     } else if ($.inArray('jqgfirstrow', trClasses) > 0) { 
      // the row is first dummy row of the grid. we skip it 
     } 
    } 

现在，如果你有row这是标准的网格行，你可以检查从具有“AlertFF”名栏的复选框。首先你应该得到列的索引（循环之外）。您可以使用the answer的小型getColumnIndexByName方法：var iCol = getColumnIndexByName($('#grid'), 'AlertFF')。现在的if ($.inArray('jqgrow', trClasses) > 0)身体的内部，你可以做

if ($.inArray('jqgrow', trClasses) > 0) { 
    if ($(row.cells[iCol]).children("input:checked") > 0) { 
     // the checkbox in the column is checked 
    } 
} 

检查来自subgrid as grid你使用，你可以做数据如下

... 
} else if ($.inArray('ui-subgrid', trClasses) > 0) { 
    // the row contains subgrid 
    var subgridTable = $(row).find("table.ui-jqgrid-btable:first"); 
    // you can work with the subgridTable like with a grid 
} 

在具有像$('#grid')相同的结构你subgridTable方式我们从中开始。你可以像前面描述的那样检查子网格的包含。