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

1. 概述

1.1 應用場景

在我們使用填報表時，不希望使用 FineReport 內建工具欄的按鈕，希望能夠自訂提交按鈕，將資料入庫。

1.2 功能簡介

自訂按鈕既可以是 FineReport 範本中新增的按鈕元件，也可以是 Web 整合頁面中，HTML 的按鈕標籤。

1）FineReport 範本中的按鈕元件實現自訂提交操作詳細請參照 JS自訂提交按鈕
2）而在 Web 頁面中，點選 HTML 中的按鈕提交 iframe 中的 FineReport 報表將在本文詳述。效果如下圖所示:

1.3 實現思路

FineReport 內建報表提交 JS 程式碼是_g().writeReport()，如果是呼叫嵌入的報表提交功能的話，使用document.getElementById('報表所在iframe的id').contentWindow._g().writeReport();

2. 操作步驟

2.1 範本準備

使用範本：%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Form\FreeFrom\FreeForm.cpt

2.2 建立 HTML 檔案

1）建立 write.html，內容如下：

點選下載檔案：write.zip

<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._g().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>