zoukankan      html  css  js  c++  java
  • EasyUI DataGrid 多级表头设置

    使用EasyUI做一个报表统计,需要合并表头为多级表头,核心代码如下:

    $('#dg').datagrid({  
        url:'datagrid_data.action',  
        fit : true,
        fitColumns : false,
        columns:
             [
                 [
                    {"title":"网格员考核测评表","colspan":9}
                 ],
                 [
                    {"field":"ORGNAME","title":"网格","rowspan":3,"80"},
                    {"field":"USERZH","title":"网格员","rowspan":3,"80"},
                    {"title":"工作纪律","rowspan":2},
                    {"title":"民主互评","rowspan":2},
                    {"title":"志愿者","rowspan":2},
                    {"title":"加分项","colspan":2},
                    {"title":"总分","rowspan":2},
                    {"title":"平均分","rowspan":2}
                 ],
                 [
                    {"title":"信息上报","rowspan":1},
                    {"title":"简报采纳","rowspan":1}
                 ],
                 [
                    {"field":"YW1","title":"5分","rowspan":1},
                    {"field":"YW2","title":"5分","rowspan":1},
                    {"field":"YW3","title":"6分","rowspan":1},
                    {"field":"YW4","title":"8分","rowspan":1},
                    {"field":"YW5","title":"5分","rowspan":1},
                    {"field":"TOTAL","title":"","rowspan":1},
                    {"field":"AVG","title":"","rowspan":1}
                 ]
             ]
    }); 

    效果如图:

    从以上代码和图中可以看出表头共有4行9列, 画单元格就和HTML中一样,主要利用 rowspan、colspan 属性

    在将要显示内容的列上添加 field 属性

  • 相关阅读:
    PAT 字符串-02 删除字符串中的子串
    带滚动条的文本文件
    PAT IO-04 混合类型数据格式化输入(5)
    PAT IO-03 整数均值
    PAT IO-02 整数四则运算
    linux 之shell
    linux 软件包安装-脚本安装
    Linux 关闭防火墙命令
    linux RPM包管理-yum在线管理
    linux 软件包管理
  • 原文地址:https://www.cnblogs.com/chenyanbin/p/12360823.html
Copyright © 2011-2022 走看看