方法与接口说明
标签属性控制方式
使用SR模块或VR标签展现报表时,均能够通过标签属性来实现工具栏的客户化。
例如:
-
整个工具栏是否显示以及显示位置可通过标签属性toolBarLocation来控制
-
每一个工具栏按钮分别对应一个标签属性,可以控制其是否显示,如打印预览按钮是否显示可以通过needPrint标签来控制
-
工具栏上添加自定义按钮,可以使用extendButtons标签属性,通过调用该标签属性,可以实现在默认工具栏添加自定义按钮
其中:
如何在工具栏添加自定义按钮
自定义按钮按照添加的顺序显示在工具栏的“其它按钮区”中。
添加自定义按钮,需按照规范格式通过extendButtons标签属性进行定义:
extendButtons="[{ico:"",title:"",click:""},{ ico:"",title:"",click:""},….可定义多个按钮]"
示例:
[{ico:"images/excel.gif",title:"button1",click:"alert(1)"} ,{ico:"images/test.png",title:"button2",click:"tesfunction(2,3)"}]
按照按钮定义格式设置extendButtons标签的属性值,即可将按钮显示到工具栏。
上面自定义按钮的定义为json串格式,其中:
-
ico设置自定义按钮使用的图片
-
title设置自定义按钮的名称
-
click设置点击按钮时调用的js方法, js方法要定义在产品标准的js客户化目录中,客户化工具栏时,如果涉及自定义的js,其部署方式请参考:客户化文件的部署。
VR展现报表时如何动态控制工具栏
在自定义的jsp中使用VR标签展现报表时,如果通过toolBarLocation标签属性使用了工具栏,可以对报表展现页面中生成的工具栏中的各个js对象进行动态控制。
例如:
- 将打印导出按钮进行禁用
- 将某个工具栏按钮转移至其他区域
- 修改整个工具栏的样式
可以通过以下固定写法进行工具栏的客户化:
$(document).ready(function(){...//控制工具栏js对象的具体js代码})
例如下面代码所示,是对工具栏中的导出Excel按钮禁用:
$(document).ready(function(){$(".vrExportExcelButton").attr("disabled",true);})
更多VR标签展现报表时的工具栏客户化示例,请参考:场景示例。
toolbarClass控制方式
toolbarClass是另一种对工具栏做客户化配置的方式.
toolbarClass同样可以实现对工具栏上按钮的禁用或启动,但toolbarClass的方式更强调灵活性,更便于对按钮样式的灵活修改,以及按钮位置的转移及工具栏区域的整合。
通过调用这些预留的class可以实现对整个工具栏、工具栏的指定区域、按钮的外观及属性控制。
工具栏具体划分及各部分对应的class如下表所示:
- 实现步骤
1、将对工具栏自定义的相关代码保存至JS文件中
2、在VR或SR中引用JS文件
注意:修改VR样式等内容的js需要加入到$(document).ready(function(){})的方法中,才能正常控制VR生成的各个对象
- 部分示例代码
1、将导出Excel按钮禁用
$(".vrExportExcelButton").attr("disabled",true);
2、将导出Word按钮隐藏
$(".vrExportWordButton").css("display","none");
3、将导出pdf按钮转移到其它按钮区
$(".vrExportPdfButton").appendTo($(".otherButtonArea"));
4、修改整个工具栏的背景色为蓝色、高度为50px
$(".toolbarClass").css({"background":"blue","height":"50"});
- 调用方法
1、VR中调用方法:在JSP中引入按钮修改的JS 文件。如:
<script type="text/javascript" src="<%=request.getContextPath() %>/js/test.js"></script>
2、SR调用方法:设置jsFiles参数的值为JS文件路径及名称。如: