反饋已提交
網絡繁忙
在自定义工具栏中,可以显示总页数,那么有什么方法能实现在工具栏中显示数据的总条数呢,如下图所示
通过在某个单元格中使用 count 函数计算总的数据条数,然后在分页预览的加载结束事件中获取对应单元格的值并赋值给主页面中的文本框或其他控件中。
注:使用 count 函数的单元格必须在扩展数据的上方单元格。
但是这样存在一个问题,当点击下一页时,单元格中显示的是下一页数据中对应单元格的数据而不是总条数。解决方法是通过使用重复标题行,让 count 函数所在的单元格固定在一个位置,如放至第一行。
打开模板:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\DetailReport\Details_5.cpt
在第一行数据前,插入一行数据,然后在 A1 单元格填写=count(A3),如下图所示:
右击第一行,隐藏第一行单元格,如下图所示:
选择隐藏即可。
给此模板增加加载结束事件,具体的 JS 代码如下:
var totalnumber=$("tr[tridx=0]","div.content-container").children().eq(0).text();//获取A1单元格的值 parent.document.getElementById("e").value="共"+totalnumber+"条数据";//给页面上id为e的文本框赋值
保存模板,具体的模板设置可参考:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\DetailReport\Details_7.cpt
打开%FR_HOME%\webapps\webroot\help\page_demo\custoolbar.html
在 body 标签中的 div 标签中增加一个文本框控件,控件的 id 为 e,定义如下:
<input type = "text" id = "e" style="width:80px">
将 iframe 的 src 更换为刚刚保存的模板即为:
<iframe id="reportFrame" onload="afterload()" src="/webroot/decision/view/report?viewlet=/doc/Primary/DetailReport/Details_7.cpt&__showtoolbar__=false" width =100% height =80%></iframe>
完整代码如下:
<html> <head> <title>工具栏显示数据总个数</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script type="text/javascript"> 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)); } </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> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.gotoNextPage()">下一页</button> <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.gotoLastPage()">末页</button> <input id="page" type="text" readonly="true" size="12" style="border:none"> 到<input id ="index" type ="text" size="3"/>页 <a onclick="gotopage()" href="javascript:void(0)">跳转</a> </div> <iframe id="reportFrame" onload="afterload()" src="/webroot/decision/view/report?viewlet=/doc/Primary/DetailReport/Details_7.cpt&__showtoolbar__=false" width =100% height =80%></iframe> </body> </html>
启动设计器,在浏览器中输入网址:http://localhost:8075/webroot/help/page_demo/totalnumber.html,效果如下图所示:
完整代码可参考:%FR_HOME%\webapps\webroot\help\page_demo\totalnumber.html
点击下载:
totalnumber.html
文 檔回 饋
滑鼠選中內容,快速回饋問題
滑鼠選中存在疑惑的內容,即可快速回饋問題,我們將會跟進處理。
不再提示
10s後關閉