報表實時顯示時間

報表，除了相對靜態地展現匯總統計數據以及分布、趨勢等數據內容外，也可以用于顯示和時間相關的即時信息，包括實時顯示時間。例如，下面這個設備監控應用統系中，首頁除了顯示實時監控數據外，還需要在右上角顯示實時時間：

這種形式的“動態報表”其實在我們生活中也隨處可見，最常見的就是火車站大屏幕上的列車時刻表，上面顯示的當前時間，讓旅客能夠一目了然地知道自己的列車還有多長時間開，等待的列車什么時候到。

其實，要在報表中做到上面的效果很簡單，基本思路就是讓頁面定時（比如每隔一秒鐘）調用JS方法，在JS中通過單元格的ID獲取到顯示時間的那個格子，將當前時間作為這個格子的新值顯示就可以了。

下面，我們就具體看看如何通過潤乾報表實現這樣司空見慣的動態顯示時間效果。

1、設置報表單元格表達式

前面第一個圖是在潤乾報表設計器自帶的報表“設備故障分析.rpx”的基礎上實現的，接下來我們就用這個報表作為例子進行說明。我們首先在自帶報表中添加時間，合并N4、O4單元格，并在該合并格中設置單元格表達式=string(now(),”yyyy年MM月dd日 hh:MM:ss”)。

2、設置JSP頁面標簽

然后，我們打開報表展現頁面showReport.jsp，在這個頁面中設置標簽屬性generateCellId，以便報表單元格在頁面生成格子的ID。

打開原始的報表展現頁面，我們發現設置當前時間的單元格，并沒有生成對應的ID，如下圖所示：

為了在JS腳本中能夠通過ID可以獲得到該單元格，以便修改該單元格的值，我們需要在展現的頁面中添加標簽屬性generateCellId=”yes”，如下圖所示：

設置了該屬性后，我們可以在頁面中可以看到，該單元格生成了對應的id值：

3、設置頁面JS方法

接下來，我們在在報表展現的頁面中添加動態改變單元格值的JS方法myrefresh(),在這個方法中通過單元格的ID動態改變該單元格中的顯示時間，同時通過setTimeout()在1秒后調用函數myrefresh。由于setTimeout()函數只會被調用一次，所以我們還需要在myrefresh()函數體中也加上這個函數，從而達到循環調用的效果，下面是具體的JS方法：

function myrefresh()

{

var tbl = document.getElementById( “report1_N12” );

var myDate = new Date();

tbl.innerHTML=myDate.toLocaleString( );

setTimeout(‘myrefresh()’,1000);

}

setTimeout(‘myrefresh()’,1000);

4、預覽頁面效果

.這樣，經過以上的簡單設置，我們就可以在showReport.jsp頁面中展現“設備故障分析.rpx”報表，并且在頁面上方看到實時變化的時間了，頁面效果如下：

通過這個簡單的例子，我們知道，就像開篇所說，報表不僅能夠呈現固定的統計匯總數據，還有相當不錯的動態展示能力。我們在這里使用的定時調用JS改變單元格的值的方式，可以實現頁面局部內容的動態變化，而且沒有閃爍刷新，毫無違和感！

怎么樣，意不意外？驚不驚喜？讓我們趕緊擼起袖子利用報表讓數據展現更加豐富起來吧！