整体变化不大,基本操作是下载最新版本,替换相关文件,步骤如下:
1:修改引用
<link href="${ctxStatic}/plugins/dataTables-1.10.22/css/dataTables.bootstrap.css" rel="stylesheet">
<link href="${ctxStatic}/plugins/dataTables-1.10.22/FixedColumns-3.3.2/css/fixedColumns.bootstrap.css" rel="stylesheet">
<script src="${ctxStatic}/plugins/dataTables-1.10.22/js/jquery.dataTables.js"></script>
<script src="${ctxStatic}/plugins/dataTables-1.10.22/js/dataTables.bootstrap.js"></script>
<script src="${ctxStatic}/plugins/dataTables-1.10.22/FixedColumns-3.3.2/js/fixedColumns.bootstrap.js"></script>
<script src="${ctxStatic}/plugins/dataTables-1.10.22/FixedColumns-3.3.2/js/dataTables.fixedColumns.js"></script>
2:验证js参数
确定raycom-integration.js中相关参数是否有效
3:修改版本内参数
1:dataTables.bootstrap.css
根据页面样式,删除margin
/* margin-top: 6px !important;
margin-bottom: 6px !important;*/
2: dataTables.bootstrap.js
移入自定义表格声明,并注释掉之前的声明
然后参照API文档,对比声明中属性值是否有变化,本次新增了几个参数
renderer: 'bootstrap',
pagingType: "full_numbers",、
并且将sDom改为dom
4:说明
本次升级主要问题集中在固定表格组件上,同时之前引用的方式不太合规,也产生了一定的影响,
主要错误信息有:
- 表格上下间隔过长,删除css的margin解决
- 固定的表头文字竖向排列,属于fix组件的bug,在其868行将宽度+1解决
- 底部换行区域有两个问题 一个是偏上,通过调整css解决,一个是位置问题,调整自定义表格信息解决