自訂提交按鈕- FineReport帮助文档 - 全面的报表使用教程和学习资料

一、概述

在使用填報表時，不希望使用 FineReport 內建的工具欄的按鈕，希望能夠自訂提交按鈕，將資料入庫。
自訂按鈕既可以是 FineReport 範本中新增的按鈕元件，也可以是 Web 整合頁面中HTML 的按鈕標簽。FineReport 範本中的
按鈕元件實現自訂提交操作詳細請參照 JS自定义提交按钮。
本文詳述在 Web 頁面中點選 HTML 中的按鈕提交 iframe 中的 FineReport 報表。

二、操作步驟

1

打開範本。

本文使用範本:%FR_HOME%\webapps\webroot\WEBINF\reportlets\doc\Form\FreeFrom\FreeForm.cpt。

2

編輯 HTML 程式碼。

實現思路說明：
FineReport 內建的報表提交 JS 程式碼是contentPane.writeReport()，調用嵌入的報表提交功能的話，使用document.getElementById('報表所在iframe的 id').contentWindow.contentPane.writeReport()實現。
在網頁中新增【提交】按鈕，程式碼：<button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.writeReport()">提交</button> 。
完整程式碼如下。

<html>     <head>     <title>自定义提交按钮</title>   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </head>     <body>     <div id="toolbar">     <button type="button" onclick="document.getElementById('reportFrame').contentWindow.contentPane.writeReport()">提交</button></div>     <iframe id="reportFrame" onload="afterload()" src="/webroot/decision/view/report?viewlet=doc/Form/FreeFrom/FreeForm.cpt&op=write&__showtoolbar__=false" width = 100% height = 80%></iframe>     </body>     </html>