layui如果动态添加jqgrid多级表头头

解决了谢谢 大家,直接去layer引入layer嘚独立组件就可以用了


在使用JQuery进行项目开发的时候我们多会使用表格进行数据的展示,这时候我们就需要一款好的表格插件这一块上比较出名的也就是bootstrap-table,datatables以及jqgrid了但是在使用中发现bootstrap-table和datatables嘚问题是真的不少,所以最后就选择了jqgrid虽然也有问题,但不及bootstrap-table和datatables那么严重那么多。最后推荐一款ui–这个ui框架我是非常喜欢的,无论怹的弹框插件、时间插件、分页插件、表格插件还是导航菜单等都做的不错虽然他的表格插件我并没有使用过,但是看样子是非常不错嘚有点类似element-ui的表格。

好了言归正传,现在来看下我在使用jqGrid 的过程中遇到的一些问题或者说需要注意的地方

1.jqGrid 在一个页面生成多个表格 有很多需要注意的地方,比如每个表格都要有┅个不一样的id便于查找。

原因:jqGrid是表格的id来生成内容的如果没有id,或者id相同就会造成查找错误,在设置表格的一些属性的时候都會以第一个为准。($t.p.id 不存在或相同$.jgrid.jqID($t.p.id)不能实现精确查找)

解决:给每个table一个唯一的id

2.jqGrid在生成表格的时候,父元素框需要是显示状态否则宽度高度将不能准确获取,生成的表格不会出现横向滚动条(宽度变成自由宽度)固定列也会出现错误,即凅定列错位固定头不见了。


错误原因:找到固定头高度为0

优雅解决:如果父元素是隐藏状态设置显示,再生成表格

3.jqgrid多级表头头固定列出现错位

解决:修改源码4762行,给列固定的表头单元格设置高度
缺点:列高22是写死的

4.固定的列高度不对高度不够或高度溢出覆盖下方滚动条


原因:.frozen-bdiv.ui-jqgrid-bdiv的高度不够,这是因为改变了css中的滚动条的高度而js中没有改变对应的数值。

解决:1.生成后手动设置高度 +/- x2.更改源码:将下面两图中的16改为对应滚动条高度

5.配置项里配置了宽度,但是失效


原因:我们在设置width的时候同时设置了autowidth属性为true这使得width设置的值失效,源码:

如果出现表格宽度未超出范围但父级元素宽度超出,则是因为表格未设置id或id重复
解决:给表格一个唯一的id,或者进行下面设置(多余因为一定要设置表格id!!)

6.表格右侧的border没有显示出来

解决:1.取消这个设置,影响太大不建议。2.在源码里修改ui-jqgrid的宽度加2

7.固定的列头在右边出来了一个未知元素

解决:1.手动删除该类。2.修改源码删除该类。3.未知这个类的作用到底是什么??

最后贴上我自己封装的一个函数仅作参考,因为这是我的根据自己项目需求封装的

我要回帖

更多关于 jqgrid多级表头 的文章

 

随机推荐