多表头grid事例

多表头grid例子
最近做了个多表头grid例子，跟大家分享下

jsp中需要先引入GroupHeaderPlugin.js和GroupHeaderPlugin.css文件  

文件下载地址：http://download.csdn.net/source/3470467和http://download.csdn.net/source/3470711

或者下载有问题可以留言，我给他发邮箱！



js文件内容


Ext.ns("text");
sasdw.text = function(){
var mainGrid;
var mainGrid_;
var mainWin;
return {
  init : function(){
    sasdw.text.doGridMain();
    sasdw.text.doGridMain_();
       sasdw.text.createWindow();
  },
  createWindow : function(){
   mainWin = new Ext.Window({
    title : '多表头例子',layout : 'column',width : 840,height : '100%',closable:false,
    items : [mainGrid,mainGrid_]
   });
   mainWin.setPosition(10, 10);
   mainWin.show();
  },
     doGridMain : function(){
   var store=new Ext.data.JsonStore({
    url : '/sas/pages/salereport/collectInOutStockAction.do?method=getList',
    root : 'root',
    totalProperty : 'totalCount',
    autoLoad : true,
    fields : [
       {name:'goodsCode',mapping:'goodsCode'},
       {name:'goodsName',mapping:'goodsName'},
       {name:'kindCode',mapping:'kindCode'},
       {name:'kindName',mapping:'kindName'},
       {name:'kindOne',mapping:'kindOne'},
       {name:'kindTwo',mapping:'kindTwo'},
       {name:'kindThree',mapping:'kindThree'},
       {name:'kindFour',mapping:'kindFour'}
    ]
   });
   var continentGroupRow = [];
   continentGroupRow = [
      {rowspan: 2},
      {header: '购进', colspan: 5, align: 'center', rowspan: 5},
      {rowspan: 1},
      {rowspan: 1},
      {header: '期初库存', colspan: 3, align: 'center', rowspan: 3}
       ]
      var group = new Ext.ux.plugins.GroupHeaderGrid({
     rows : [continentGroupRow]
   });
   mainGrid = new Ext.grid.GridPanel({
    region : 'center',layout : 'fit',height : 200,store : store,
    autoScroll: false,enableHdMenu : false,autoWidth : true,border: true,frame : true,
    columns : [

          new Ext.grid.RowNumberer(),
          {header : '商品指标',dataIndex:'kindName',width:150},
       {header : '合计',dataIndex:'goodsName',width:60},
       {header : '省内工业',dataIndex:'kindCode',width:60},
       {header : '省外',dataIndex:'goodsName',width:60},
       {header : '省内调入',dataIndex:'kindCode',width:60},
       {header : '专卖',dataIndex:'goodsName',width:60},
       {header : '系统外销',dataIndex:'kindOne',width:60},
       {header : '系统内销',dataIndex:'kindThree',width:60},
       {header : '合计',dataIndex:'kindFour',width:60},
       {header : '省内',dataIndex:'kindFour',width:60},
       {header : '省外',dataIndex:'kindFour',width:60}
       ],
    bbar : new Ext.PagingToolbar({
     pageSize : 50,
     store : store,
     displayInfo : true,
     displayMsg : "当前第{0}-{1}条记录,共 {2} 条记录"
    }),
    plugins : group,
    viewConfig : { width:840,forceFit : false}
   });
  }

}

}();
Ext.onReady(text.init, text);