javascript - 带有 json 的 jquery 子网格

Question

我正在使用 jqgrid。我需要实现网格的子网格。我的代码如下:

<div class="ww90p">
<!-- class="sheet"--> 
<div class="" >
    <table id="setcols" class="scroll">   </table>
    <div id="psetcols" class="scroll"></div>
</div>
</div>

$("#setcols").jqGrid(
    $.extend( {}, jqGrid_normal, {
    url: "/account/chartjson/?{{ query_fragment }}&nd="+new Date().getTime(),
    caption: "&nbsp;",
    colModel:[
        {name:'number', width:50, label: "Number", sortable:false },
        {name:'name', width:300, label: "Name", sortable:false },
        {name:'opening_date', label: "Opening Date", width:150, sortable:false },
        {name:'balance', label: "Balance", width: 100, sortable:false,align:'right' }
    ],
    pager: '#psetcols',
    sortname: 'number',
    sortorder: "desc",
    multiselect: true,
    viewrecords: true, 
    footerrow : true,
    userDataOnFooter : true,
    subGrid: true,
    subGridUrl :"/account/subgridjson/?{{ query_fragment }}&nd="+new Date().getTime(),
    subGridModel: [
             { name : ['number','name','opening_date','balance'], width : [55,200,80,80] }
        ]
}));

子网格的 JSON 文件输出:

{
    rows: [
        {type: "4", number: "101", name: '<a href="/ledger/view_by_account?account_id=3">Bank (123456789
)</a>', opening_date: "2009-05-12", balance: "0.000000"}
    ]
}

但是错误提示:

cur is undefined[Break on this error] for (var j=0;j<cur.length;j++) {......

我无法克服这个问题。如果有人可以帮助我。

Answer 1

我发现转储内置子网格并使用他们的“subgrid-as-grid”示例来动态插入全新的网格更容易:

From their wiki:

subGrid: true,
subGridRowExpanded: function(subgrid_id, row_id) {
// we pass two parameters
// subgrid_id is a id of the div tag created within a table
// the row_id is the id of the row
// If we want to pass additional parameters to the url we can use
// the method getRowData(row_id) - which returns associative array in type name-value
// here we can easy construct the following
   var subgrid_table_id;
   subgrid_table_id = subgrid_id+"_t";
   jQuery("#"+subgrid_id).html("<table id='"+subgrid_table_id+"' class='scroll'></table>");
   jQuery("#"+subgrid_table_id).jqGrid({
      url:"subgrid.php?q=2&id="+row_id,
      datatype: "xml",
      colNames: ['No','Item','Qty','Unit','Total'],
      colModel: [
        {name:"num",index:"num",width:80,key:true},
        {name:"item",index:"item",width:130},
        {name:"qty",index:"qty",width:80,align:"right"},
        {name:"unit",index:"unit",width:80,align:"right"},           
        {name:"total",index:"total",width:100,align:"right",sortable:false}
      ],
      height: 100%,
      rowNum:20,
      sortname: 'num',
      sortorder: "asc"
   });