报表控件FineReport如何工具栏上显示数据总个数
1、模板设置打开模板打开模板:%FR_HOME%\WebReport\WEB-INF\reportlets\doc\Primary\DetailReport\Details_5.cpt修改模板在第一行数据前,插入一行数据,然后在A1单元格填写=count(A3),如下图所示:
2、隐藏行列隐藏第一行单元格,右击第一行,弹出下图:选择隐藏即可。
3、加载结束事件设置给此模板增加加载结束事件,具体的JS代码如下:var totalnumber=$("tr[tridx=0]&鳎溻趄酃quot;,"div.content-container").children().eq(0).text();//获取A1单元格的值parent.document.getElementById("e").value="共"+totalnumber+"条数据";//给页面上id为e的文本框赋值保存模板
4、页面设置打开html页面打开%FR_HOME%\WebReport\page_demo\custoolbar.html。增加一个文本框在body标签中的div标签中增加一个文本框控件,控件的id为e,定义如下:<input type = "text" id = "e" style="width:50px">
5、更换iframe的src将iframe的src更换为刚刚保存的模板即为:/WebReport/ReportServer?reportlet=/doc/Primary/DetailReport/Details_7.cpt&__showtoolbar__=false
6、完整代码如下:<html> <head> <title>自定义浏览页面</title> <script type="text/javascript"> function afterload(){ var contentPane = document.getElementById("reportFrame").contentWindow.contentPane; var cPageIndex = contentPane.currentPageIndex; var pv = "第" + cPageIndex + "页/共" + contentPane.reportTotalPage + "页"; document.getElementById("a").value = pv; contentPane.on("afterload", function(){ cPageIndex = contentPane.currentPageIndex; pv = "第" + cPageIndex + "页/共" + contentPane.reportTotalPage + "页"; document.getElementById("a").value = pv; }); } function gotopage() { var contentpane= document.getElementById('reportFrame').contentWindow.contentPane; var page = document.getElementById("c").value; if(page >= contentpane.reportTotalPage) { contentpane.gotoLastPage(); } contentpane.gotoPage(parseInt(page)); } </script> </head> <body> <div id="toolbar"> <input type = "text" id = "e" style="width:80px"><button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.gotoFirstPage()">首页</button> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.gotoPreviousPage()">上一页</button> <input id="a" type="text" readonly="true" style="width:80px"> <lable id ="b">到</lable> <input id ="c" type ="text" style="width:30px" onchange="gotopage()"/> <lable id ="d">页</lable> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.gotoNextPage()">下一页</button> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.gotoLastPage()">末页</button> </div> <iframe id="reportFrame" onload="afterload()" src="/WebReport/ReportServer?reportlet=/doc/Primary/DetailReport/Details_7.cpt&__showtoolbar__=false" width = 100% height = 80%></iframe> </body> </html>
7、效果查看