JS實現決策報表參數界面自動查詢

1.1 問題描述

決策報表中添加參數面板後，一般情況是點擊「查詢」按鈕，才會展現報表主體内容。如何實現不點擊「查詢」按鈕，參數控件選擇值之後即可将報表結果展現出來呢？如下圖所示：

1.2 實現思路

可以給參數面板中的控件添加 JS 事件，實現控件選擇或編輯值後查詢數據，呈現報表。JS 接口爲：

_g().parameterCommit();

2.1 準備模板

1）新建一張決策報表，新增數據集 ds1，SQL 語句爲：SELECT * FROM 銷量 where 地區='${地區}'，其中有一個數據集參數「地區」。如下圖所示：

2）在 body 中添加參數面板和一個報表塊 report0。如下圖所示：

3）在「地區」參數添加在參數面板中，控件類型選擇「下拉框控件」。如下圖所示：

4）選中下拉框控件，在「組件設置>屬性>數據字典」處爲「下拉框控件」綁定數據字典。類型選擇「數據庫表」，數據庫爲 「FRDemo」，數據表爲「銷量」，實際值與顯示值的列名都選擇「地區」。如下圖所示：

5）點擊報表塊 report0，編輯 report0，将數據集字段拖入單元格中，設計報表樣式。如下圖所示：

最終模板如下圖所示：

2.2 添加事件

點擊參數面板上的「地區」下拉框控件，在「組件設置>事件」處爲其添加一個「編輯後」事件，實現控件選擇值後觸發查詢，不點擊「查詢」按鈕即可展現報表。如下圖所示：

JavaSccript 代碼如下：

_g().parameterCommit();

注：移動端需要将 JS 添加到編輯結束事件中。

2.3 預覽效果

保存模板，點擊「PC端預覽」，地區下拉框選擇地區後，不用點擊查詢按鈕，報表即呈現。 PC 端效果如下圖所示：

App 及 HTML5 效果如下圖所示：

已完成的模板，可參見：%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\JS\表單JS實例\23-決策報表自動查詢JS.frm

點擊下載模板：23-決策報表自動查詢JS.frm