嵌套表头这个性能在经验了屡次调整后,终于在V2.13.0这个版本内公布。

成果展现

先来一张嵌套表头的效果图

如何应用

配置起来相当简略,只须要在配置项中的columnData中减少children属性即可实现。

children属性为数组类型, 与columnData应用形式雷同,children可有限嵌套。

<table id='table-demo-nestedCode'></table>
new GridManager(document.querySelector('table'), {    gridManagerName: 'demo-nestedCode',    columnData:[        // 列的惟一索引。字符串类型,必设项        key: 'title',                // 列的显示文本。[字符串 或 函数]类型,必设项。        // 如果以后应用了angular、vue、react版本,这里能够间接应用框架模版        text: '题目',                // 子项配置, 通过该项能够实现嵌套表头        // 存在该项时,将禁用: supportConfig、supportDrag、supportAdjust、columnData.fixed        // 数组对像与columnData对象配置雷同,可多层嵌套。        // 留神: 现有版本中最初一层的宽度会平分上一层的宽度        children: []    ]});

如上示例,通过在columnData数组元素中配置children指定嵌套表头。
但须要留神的是,当应用嵌套表头时将禁用:

  • supportConfig: 列的显示暗藏性能
  • supportDrag: 列的挪动性能
  • supportAdjust: 列宽度调整性能
  • columnData.fixed: 列固定性能

GridManager的其它性能

性能形容
宽度调整表格的列宽度可进行拖拽式调整
地位更换表格的列地位进行拖拽式调整
配置列可通过配置对列进行显示暗藏转换
表头吸顶在表存在可视区域的状况下,表头将始终存在于顶部
列固定指定某列固定在左侧或右侧
排序表格单项排序或组合排序
分页表格ajax分页,蕴含抉择每页显示总条数和跳转至指定页性能
用户偏好记忆记住用户行为,含用户调整的列宽、列程序、列可视状态及每页显示条数
序号主动生成序号列
全选主动生成全选列
导出静态数据导出、动态数据导出、已选数据导出
打印当前页打印
右键菜单罕用性能在菜单中可进行快捷操作
过滤通过对列进行过滤达到疾速搜寻成果
合并同一列下雷同值的单元格可主动合并
树表格可通过配置疾速实现树型表格构造
行挪动可通过配置疾速实现行地位挪动
嵌套表头无层级限度配置简单的表格实例

相干链接

  • api
  • github

写在最初:

我的项目自2015年初保护至今, 最后的想法从未扭转: 疾速、灵便的对Table标签进行实例化,让Table标签充满活力。