FineReport——JS二次开发(自定义翻页按钮)
2015-10-12 09:31
429 查看
FR允许自定义工具栏上面的按钮,并提交JS方法:
对于翻页功能,大概有首页,下一页,上一页,最后一页,以及跳转页等功能。
不得不说的是,在HTML页面自定义的按钮如何获取到报表模板,通过FR提供的JS方法,可以获取到这个模板(reportFrame为html标签iframe的id名称):
首页:
下一页/上一页/最后一页:
页码显示,既以当前页/总数页的格式显示页码:
跳转页(需要注意的是,跳转到的页码必须是数值型,而文本框的输入值为字符型,所以需要转换数据类型):
对于翻页功能,大概有首页,下一页,上一页,最后一页,以及跳转页等功能。
不得不说的是,在HTML页面自定义的按钮如何获取到报表模板,通过FR提供的JS方法,可以获取到这个模板(reportFrame为html标签iframe的id名称):
document.getElementById('reportFrame').contentWindow.contentPane.方法名称();
首页:
document.getElementById('reportFrame').contentWindow.contentPane.gotoFirstPage();
下一页/上一页/最后一页:
gotoPreviousPage()/gotoNextPage()/gotoLastPage()
页码显示,既以当前页/总数页的格式显示页码:
function afterload() { //iframe加载后触发 var contentPane = document.getElementById("reportFrame").contentWindow.contentPane; //获取报表contentPane var cPageIndex = contentPane.currentPageIndex; //当前所在页 var pv = "第" + cPageIndex + "页/共" + contentPane.reportTotalPage + "页"; //报表首次加载结束后显示的页码信息 document.getElementById("page").value = pv; //将页码信息赋给page文本 contentPane.on("afterload", function() { //报表加载结束监听事件 cPageIndex = contentPane.currentPageIndex; //每次加载完后重新获取当前页码 pv = "第" + cPageIndex + "页/共" + contentPane.reportTotalPage + "页"; //重新生成页码信息 document.getElementById("page").value = pv; //重新给page文本赋页码信息 }); }
跳转页(需要注意的是,跳转到的页码必须是数值型,而文本框的输入值为字符型,所以需要转换数据类型):
function gotopage() { var contentpane= document.getElementById('reportFrame').contentWindow.contentPane; var page = document.getElementById("index").value; if(page >= contentpane.reportTotalPage) { contentpane.gotoLastPage(); } contentpane.gotoPage(parseInt(page)); }
相关文章推荐
- JavaScript实现上下浮动的窗口效果代码
- js table 相关操作的总结
- Ember.js 入门指南——自定义包裹组件的HTML标签
- [Javascript] Using JSHint for Linting with Gulp
- 简单的JSP分页显示
- jsp实现简单验证码的方法
- JSP实现网页访问统计
- JS中的正则表达式及pattern的注意事项
- JavaScript与HTML结合的基本使用方法整理
- JavaScript实现上下浮动的窗口效果代码
- JS实现新浪微博效果带遮罩层的弹出框代码
- JavaScript 性能优化小结
- 编写高性能Javascript代码的N条建议
- JS 学习之作用域和变量解析
- jsp 时间格式化 YYYY-MM-DD
- Ember.js 入门指南——自定义包裹组件的HTML标签
- JavaScript-js中函数问题
- JavaScript-js中把一个函数赋给一个对象时带不带括号的区别?
- js学习笔记_匿名函数
- javascript操作css实现弹出对话框