关于 easyui 冻结列的问题,多级表头问题
程序员文章站
2024-02-04 21:11:46
...
由于客户需求,自己在项目上尝试排查了很多有可能的错误之后
前端控制台 一直弹出Cannot read property 'width' of null的错误,我刚开始不是很明白为什么会弹出这个错误,按照字面意思来看我并没有写错的宽度。我就开始找这个问题出现的原因,搜了很多博客没有我想要的答案。
在多次对比easyui的冻结列demo的时候我发现我和demo有区别的地方。
我的表头中带有**rowspan**属性,我感觉可能是这个原因
一开始是这样的
frozenColumns:[[
{field:'id',checkbox:true,width:25,rowspan:2},
{field:'guid',hidden:true, width:150,rowspan:2},
{field:'name',hidden:true, width:150,rowspan:2},
{field:'projectcode',title:'测测测',width:150,sortable:true,align: 'center',editor:{type:'textarea',options: {rows:'8'}},rowspan:2},
{field:'erpcode',title:'测测测',width:40,sortable:true,align: 'center',editor:{type:'textarea',options: {rows:'8'}},rowspan:2},
{field:'development_organization',title:'测测测',width:40,sortable:true,editor:{type:'textarea',options: {rows:'8'}},align: 'center',rowspan:2},
{field:'project_name',title:'测测测',width:100,sortable:true,align: 'center',editor:{type:'textarea',options: {rows:'8'}},rowspan:2},
]
]
后来在发现多级表头的时候不能这样,以下是修改版
frozenColumns:[[
{field:'id',checkbox:true,width:25,rowspan:2},
{field:'guid',hidden:true, width:150,rowspan:2},
{field:'name',hidden:true, width:150,rowspan:2},
{field:'projectcode',title:'测测测',width:150,sortable:true,align: 'center',editor:{type:'textarea',options: {rows:'8'}},rowspan:2},
{field:'erpcode',title:'测测测',width:40,sortable:true,align: 'center',editor:{type:'textarea',options: {rows:'8'}},rowspan:2},
{field:'development_organization',title:'测测测',width:40,sortable:true,editor:{type:'textarea',options: {rows:'8'}},align: 'center',rowspan:2},
{field:'project_name',title:'测测测',width:100,sortable:true,align: 'center',editor:{type:'textarea',options: {rows:'8'}},rowspan:2},
],
[]//多级表头 需要保证二维数组,数组数量一致
]
treegrid datagrid中都可使用 frozenColumns属性 需要注意的是 多级表头 需要保证二维数组,数组数量一致
也就是说 在columns属性中 存在几个数组 需要将固定列的数组数量保持一致填上空的数组。
就这个看起来很小的问题,最后还是公司的前辈帮我找到的博客解决了多级表头的问题。
推荐阅读
-
关于 easyui 冻结列的问题,多级表头问题
-
[MySQL]实现树形的遍历(关于多级菜单栏以及多级上下部门的查询问题)_MySQL
-
关于CSS+div两列布局的问题_html/css_WEB-ITnose
-
layui table表格 表头与内容列错位问题(只有纵向滚动条的情况)
-
JS 组件系列之Bootstrap Table的冻结列功能彻底解决高度问题
-
详解python关于多级包之间的引用问题
-
给el-table的表头某列添加自定义el-dropdown,点击无效的问题
-
关于PHP结合html表格查询数据汇总行或列的有关问题
-
关于elementui表格formatter列格式化内容展示,顺带处理表格不能显示布尔值的问题。
-
关于 bootstrap 3 显示 5 列的问题_html/css_WEB-ITnose