关于easyUI 实现复杂表头的问题

来源:互联网 发布:聊天交友软件排行 编辑:程序博客网 时间:2024/06/05 02:53


//html  内容如下:


<!-- 内容开始 -->
<div class="content">
<table id="memberDispatch_grid" class="easyui-datagrid" data-options="isField:'id',checkOnSelect: false,rownumbers:true,nowrap:false,striped:true,pageSize: 50,pageList:[10,20,30,40,50],loadMsg:'正在加载中...',singleSelect:false,fitColumns:true,pagination:true">
</table>
</div>

<!-- 内容结束 -->


// js 内容如下:


 //列表:
  var columns = [
   //表头第一行
   [
   {field:'shopName',title:"店铺账号",align:"center",rowspan:3,width:80,sortable:false,formatter:function(val,row,index){
  return val;  
   }},
      {title:"派单",align:"center",colspan:16}
      ],
      //第二行
      [
       {field:'col1',title:"推送",align:"center",colspan:2},
       {field:'col3',title:"已应标",align:"center",colspan:2},
       {field:'col5',title:"超时未响应",align:"center",colspan:2},
       {field:'col7',title:"联系未响应",align:"center",colspan:2},
       {field:'col9',title:"投标违约",align:"center",colspan:2},
       {field:'col11',title:"主动放弃",align:"center",colspan:2},
       {field:'col13',title:"运营中止",align:"center",colspan:2},
       {field:'col15',title:"雇主淘汰",align:"center",colspan:2}
       ],
       //第三行
      [
       {field:'pushNum',title:"订单数",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
    }},
       {field:'pushPrice',title:"订单金额(元)",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'enrollNum',title:"订单数",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'enrollPrice',title:"订单金额(元)",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'acceptOverNum',title:"订单数",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'acceptOverPrice',title:"订单金额(元)",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'connectOverNum',title:"订单数",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'connectOverPrice',title:"订单金额(元)",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'offerOverNum',title:"订单数",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'offerOverPrice',title:"订单金额(元)",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'acceptGiveUpNum',title:"订单数",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'acceptGiveUpPrice',title:"订单金额(元)",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'abortNum',title:"订单数",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'abortPrice',title:"订单金额(元)",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'revokeNum',title:"订单数",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }},
       {field:'revokePrice',title:"订单金额(元)",align:"center",sortable:false,formatter:function(val,row,index){
    return val;  
   }}
      
      ]]; 
 

      //项目中所需传递的参数,
  var param = init_param();
 
  memberDispatch_grid = $('#memberDispatch_grid').datagrid({
method:'post',

                        //参数传递
queryParams: param,
url:'<%=rPath %>storeStatis/gerMemberDisDetailIndex',
columns : columns
});
  

//实现效果: