欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

关于 easyui 冻结列的问题,多级表头问题

程序员文章站 2024-02-04 21:11:46
...
由于客户需求,自己在项目上尝试排查了很多有可能的错误之后
前端控制台 一直弹出Cannot read property 'width' of null的错误,我刚开始不是很明白为什么会弹出这个错误,按照字面意思来看我并没有写错的宽度。我就开始找这个问题出现的原因,搜了很多博客没有我想要的答案。
在多次对比easyui的冻结列demo的时候我发现我和demo有区别的地方。
我的表头中带有**rowspan**属性,我感觉可能是这个原因 
一开始是这样的

关于 easyui 冻结列的问题,多级表头问题

		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},
		
	]
	]

后来在发现多级表头的时候不能这样,以下是修改版
关于 easyui 冻结列的问题,多级表头问题

		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属性中 存在几个数组 需要将固定列的数组数量保持一致填上空的数组。
就这个看起来很小的问题,最后还是公司的前辈帮我找到的博客解决了多级表头的问题。