报表实时显示时间

报表，除了相对静态地展现汇总统计数据以及分布、趋势等数据内容外，也可以用于显示和时间相关的即时信息，包括实时显示时间。例如，下面这个设备监控应用统系中，首页除了显示实时监控数据外，还需要在右上角显示实时时间：

创新互联于2013年成立，先为裕安等服务建站，裕安等地企业，进行企业商务咨询服务。为裕安企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。

报表实时显示时间

这种形式的“动态报表”其实在我们生活中也随处可见，最常见的就是火车站大屏幕上的列车时刻表，上面显示的当前时间，让旅客能够一目了然地知道自己的列车还有多长时间开，等待的列车什么时候到。

报表实时显示时间

其实，要在报表中做到上面的效果很简单，基本思路就是让页面定时（比如每隔一秒钟）调用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);