1. 概述
1.1 問題描述
在查詢報表的時候,即使沒有查詢結果,也會把表頭和表尾等資訊顯示出來。如下圖所示:
但是我們希望查詢結果為空時下面的報表區域什麼都不顯示,就像從來沒有執行過查詢一樣。而能查詢出結果的,就正常顯示報表。該如何實現呢?
1.2 解決思路
選擇某一個查詢結果所在的儲存格,如 1.1 中所述,查詢結果是「地區」,顯示地區的儲存格為 A2 ,判斷該儲存格是否為空,為空則隱藏整個報表區域。
隱藏報表區域可透過條件屬性設定列高為 0 實現,也可透過新增載入結束事件寫 JavaScript 腳本實現。
2. 範例
2.1 準備資料
建立普通報表,建立資料庫查詢 ds1,SQL 查詢語句為:SELECT * FROM 銷量 WHERE 地區='${地區}' ,如下圖所示:
2.2 表格設計
A1~C1 儲存格輸入標題,A2~C2 儲存格插入對應資料欄,設定 A2、B2 「資料設定」為「分組」,擴展方向為「縱向擴展」,C2 資料設定為「匯總」,C3 儲存格插入公式 SUM(C2)。表格樣式如下圖所示:
2.3 參數設定
將參數「地區」新增至參數面板,設定元件類型為「正文元件」,元件值為空,如下圖所示:
儲存報表,點選「分頁預覽」,不輸入地區或輸入地區不存在時,即查詢結果為空時,效果如下圖所示:
2.4 方案一:設定條件屬性
給每一列的第一個儲存格都新增一個條件屬性,設定列高為 0 ,公式條件為「公式類型」,公式為 len(A2)=0。
當條件屬性一樣時,可同時選中 A1、A2、A3 儲存格新增,步驟如下圖所示:
2.5 方案二:新增載入結束事件
選擇「範本>範本 Web 屬性>分頁預覽設定」(其他預覽模式下同理設定),選擇「為該範本單獨設定」,在下方事件設定處新增「載入結束」事件,輸入 JavaScript 程式碼。
JavaScript 程式碼如下:
if ($("[id^=A2]").text().length == 0) {
$(".x-table").css("display", "none");
}
步驟如下圖所示:
2.6 效果預覽
2.6.1 PC 端
儲存報表,點選「分頁預覽」,上述兩種方案效果相同,如下圖所示:
2.6.2 行動端
新增載入結束事件的方案不支援行動端,設定條件屬性的方案支援 App 端和 H5 端,效果如下圖所示: