JS實現點擊參數面板按鈕顯示或隱藏數據

當報表中列出數據太多時，想經過顯示按鈕隱藏明細數據只顯示統計數據。以下圖示例，那麼該如何實現呢？本文以FineReport爲例，來說述JS如何實現點擊參數面板按鈕顯示或隱藏數據。

打開報表
在參數面板添加一個標籤控件，控件名爲lable，設置標籤控件不可見，控件值爲「顯示」。

在參數面板添加一個按鈕控件，控件名爲button，控件值爲「只顯示合計數據」，並添加點擊事件。

編輯點擊事件，添加下面的JavaScript代碼：

/*獲取隱藏的標籤控件的值*/
var label= this.options.form.getWidgetByName("label").getValue();

/*判斷標籤控件的值*/
if(label=='顯示')
{
    /*當標籤控件的值爲顯示時，則改成隱藏，並修改按鈕名稱爲顯示全部數據*/
    this.options.form.getWidgetByName("label").setValue("隱藏");
    this.options.form.getWidgetByName("button").setValue("顯示全部數據");
}
else
{
    /*當標籤控件的值不爲顯示時，則改成顯示，並修改按鈕名稱爲只顯示合計數據*/
    this.options.form.getWidgetByName("label").setValue("顯示");        
    this.options.form.getWidgetByName("button").setValue("只顯示合計數據");
}

/*執行查詢*/
_g().parameterCommit();

點擊參數面板空白處，將「點擊查詢前不顯示報表內容」屬性的勾去掉。

回到報表設計界面，右鍵B3單元格，添加條件屬性，設置行高爲0毫米，添加公式條件爲$label = '隱藏'。

保存模板，點擊分頁預覽便可看到上圖的效果。