历史版本3 :自定义打印按钮 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 版本

报表服务器版本
11.0

1.2 问题描述

用户在遇到 FineReport 报表嵌入 iframe 中的场景时,如果需要打印报表内容,可以自定义打印按钮并将其放置在报表外部。

1.3 实现思路

如果报表嵌入在 ID 为 reportFrame 的 iframe 中,可以通过下面格式的 JS 代码,直接调用 FineReport 内置工具栏中的方法即可。

document.getElementById('reportFrame').contentWindow.contentPane.pdfPrint();

注:document 对象介绍请参见:document对象

2. 示例编辑

2.1 模板准备

本文示例使用模板%FR_HOME%\webapps\webroot\WEB-INF\reportlets\GettingStarted.cpt来作为内嵌 iframe。

2.2 新建 HTML 文件

1)新建 print.html,内容如下:

文件下载链接:https://helpfile.obs.cn-east-3.myhuaweicloud.com/%E6%96%87%E4%BB%B6/print.html

<!DOCTYPE html>
<html>
<head>
<title>自定义打印</title>  
<meta http-equiv="Content-Type" content="text/html; " charset="UTF-8">
</head>
<body>
<div>
<button type="button" onClick="document.getElementById('reportFrame').contentWindow.contentPane.pdfPrint()">打印</button>
</div>
<iframe id="reportFrame" src="http://localhost:8075/webroot/decision/view/report?viewlet=GettingStarted.cpt" height="1200px" width="960px"></iframe>
</body>
</html>

2)将print.html放置到 %FR_HOME%\webapps\webroot\help\page_demo 路径下,如下图所示:

2.3 效果预览

启动设计器,在浏览器端输入http://localhost:8075/webroot/help/page_demo/print.html,效果如下图所示: