jQGrid多行标题

Question

我想扩展jQgrid以为我的jquery mmobile应用程序创建多个标题。

是这样的：

------------------------- 
    |  Main Header  | <---------------- level 1 
    ------------------------- 
    | Sub1  | Sub2 |  <---------------- level 2 
    ------------------------- 
    | Sub1 | Sub2 | Sub3 |  <---------------- level 3 
    ------------------------- 

如何做到这一点？

Thnak you

Answer 1

请尝试以下代码。

JS代码：

mygrid = $("#list"), 
       colModel, i, cmi, tr = "<tr>", skip = 0, ths; 

      mygrid.jqGrid({ 
       datatype:'local', 
       data: mydata, 
       colNames:['Inv No','Date','Client A','Client B','Amount','Tax','Total','Closed','Shipped via','Notes'], 
       colModel:[ 
        {name:'id',index:'id',width:70,align:'center',sorttype: 'int'}, 
        {name:'invdate',index:'invdate',width:80, align:'center', sorttype:'date', 
        formatter:'date', formatoptions: {newformat:'d-M-Y'}, datefmt: 'd-M-Y'}, 
        {name:'name',index:'name', width:70, 
        cellattr: function(rowId, tv, rawObject, cm, rdata) { 
          if (Number(rowId) < 5) { return ' colspan=2' }} }, 
        {name:'nameB',index:'nameB', width:70, 
        cellattr: function(rowId, tv, rawObject, cm, rdata) { 
          if (Number(rowId) < 5) { return ' style="display:none;"' }}}, 
        {name:'amount',index:'amount',width:100, formatter:'number', align:'right'}, 
        {name:'tax',index:'tax',width:70, formatter:'number', align:'right'}, 
        {name:'total',index:'total',width:120, formatter:'number', align:'right'}, 
        {name:'closed',index:'closed',width:110,align:'center', formatter: 'checkbox', 
        edittype:'checkbox',editoptions:{value:'Yes:No',defaultValue:'Yes'}}, 
        {name:'ship_via',index:'ship_via',width:120,align:'center',formatter:'select', 
        edittype:'select',editoptions:{value:'FE:FedEx;TN:TNT;IN:Intim',defaultValue:'Intime'}}, 
        {name:'note',index:'note',width:100,sortable:false} 
       ], 
       rowNum:10, 
       rowList:[5,10,20], 
       pager: '#pager', 
       gridview:true, 
       rownumbers:true, 
       sortname: 'invdate', 
       viewrecords: true, 
       sortorder: 'desc', 
       caption:'Just simple local grid', 
       height: '100%' 
      }); 

工作示例：

Ok-soft

样品小提琴：

Fiddle