FR物件使用說明- FineReport帮助文档 - 全面的报表使用教程和学习资料

1. 概述

前端預覽報表時，範本會被轉為 HTML，這個 HTML 的 head 標籤中會引入 FineReport 內建 JavaScript 檔案finereport.js，代碼如下：

<script type="text/javascript" src="/webroot/decision/view/report?op=emb&resource=finereport.js"></script>

finereport.js在報表工程目錄中沒有實體檔案，是由多個 JS 檔案直接在後臺記憶體中連結而成的。其中包含了許多內建 function 以及一些公有的屬性，不管是在範本中還是其他網頁中，只要引入了finereport.js，就能獲取到 FR 物件並且透過 FR.xxx 的形式呼叫公有的屬性與方法。FR 物件的屬性和方法可查看：全局API。

2. 功能介紹

報表載入時會自動引入finereport.js，因此在報表中新增 JavaScript 腳本時，可以直接使用 FR.xxx 來呼叫 FR 方法；如果需要在自己的網頁，如某個 JSP 頁面中呼叫 FR 的方法，需要先在 head 標籤引入 finereport.js ，再透過 FR.xxx 來呼叫 FR 方法。

3. 範例

3.1 報表中呼叫FR方法

3.1.1 新增按鈕

建立普通報表，選中 A1 儲存格，給儲存格新增一個【按鈕元件】，按鈕名稱改為【測試】，如下圖所示：

3.1.2 新增事件

進入【事件】，給按鈕新增一個【點擊】事件，如下圖所示：

JavaScript 代碼如下代码块所示：

FR.showDialog("Test",600,400,"Hello World")

3.1.3 效果預覽

儲存報表，點選【填報預覽】，點選【測試】按鈕後，彈出提示對話框，如下圖所示：

3.2 網頁中呼叫FR方法

3.2.1 建立HTML檔案

建立一個 HTML 檔案，實現自訂一個按鈕，點選按鈕彈出提示框。因為要用到 FR 物件的 showDialog 方法，所以代碼中需要引入 FineReport 內建 JavaScript 檔案finereport.js。自訂代碼如下：

點擊可下載 HTML 檔案：showDialog方法.rar。

注：代碼中呼叫了 CSS 彈框樣式。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
 <head>
  <title>FineReport Demo</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <script type="text/javascript" src="/webroot/decision/view/report?op=emb&resource=finereport.js"></script>
  <link rel="stylesheet" type="text/css" href="/webroot/decision/view/report?op=emb&amp;resource=finereport.css&amp;cssVersion=1557882553214">
  <script>
function button_onclick(){
FR.showDialog("Test", 600, 400, "Hello World")
}
</script>
<input type="button" value="測試" onclick="javascript:button_onclick();" />
 </head>
 <body>
</body>  
</html>

3.2.2 放置HTML檔案

將 HTML 檔案儲存到%FR_HOME%\webapps\webroot工程路徑下，如下圖所示：

3.2.3 效果預覽

注：預覽時工程必須是運作的。

開啟瀏覽器，地址欄輸入 HTML 檔案的 URL 路徑，如本地工程輸入：http://localhost:8075/webroot/1.html，即可存取該 HTML 檔案。

點選測試按鈕後，彈出提示框，提示框效果和 3.1 節報表中呼叫實現的效果一致。如下圖所示：

上一篇：FR.doURLPrint

下一篇：全局API-FR

有幫助
沒幫助
只是瀏覽
圖片不清晰
用語看不懂
功能說明看不懂
操作說明太簡單
內容有錯誤

中文（简体） English 日本語

中文（繁體）

FR物件使用說明