博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
报表如何自动刷新实时显示时间?
阅读量:5743 次
发布时间:2019-06-18

本文共 1379 字,大约阅读时间需要 4 分钟。

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

 

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

 

 

其实,要在报表中做到上面的效果很简单,基本思路就是让页面定时(比如每隔一秒钟)调用JS方法,在JS中通过单元格的ID获取到显示时间的那个格子,将当前时间作为这个格子的新值显示就可以了。

 

下面,我们就具体看看如何通过润乾报表实现这样司空见惯的动态显示时间效果。

  1. 设置报表单元格表达式。

前面第一个图实际上是在润乾报表设计器自带的报表“设备故障分析.rpx”的基础上实现的。我们首先在自带报表中添加时间,合并N4、O4单元格,并在该合并格中设置单元格表达式=string(now(),"yyyy年MM月dd日 hh:MM:ss")。

 

  1. 然后,我们打开报表展现页面showReport.jsp,在这个页面中设置标签属性generateCellId,以便报表单元格在页面生成格子的ID。

打开原始的报表展现页面,我们发现设置当前时间的单元格,并没有生成对应的ID,如下图所示:

 

为了在JS脚本中能够通过ID可以获得到该单元格,以便修改该单元格的值,我们需要在展现的页面中添加标签属性generateCellId="yes",如下图所示:

 

设置了该属性后,我们可以在页面中可以看到,该单元格生成了对应的id值:

 

  1. 接下来,我们在在报表展现的页面中添加动态改变单元格值的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);

 

  1. 这样,经过以上的简单设置,我们就可以在showReport.jsp页面中展现“设备故障分析.rpx”报表,并且在页面上方看到实时变化的时间了,页面效果如下:

 

 

通过这个简单的例子,我们知道,就像开篇所说,报表不仅能够呈现固定的统计汇总数据,还有相当不错的动态展示能力。我们在这里使用的定时调用JS改变单元格的值的方式,可以实现页面局部内容的动态变化,而且没有闪烁刷新,毫无违和感!意不意外?惊不惊喜?让我们赶紧撸起袖子利用报表让数据展现更加丰富起来吧!

 

转载于:https://www.cnblogs.com/shiGuangShiYi/p/9842717.html

你可能感兴趣的文章
Struts2 学习小结
查看>>
测试工具综合
查看>>
【记录】JS toUpperCase toLowerCase 大写字母/小写字母转换
查看>>
在 Linux 系统中安装Load Generator ,并在windows 调用
查看>>
Visifire charts ToolBar
查看>>
Mysql查询
查看>>
数据传输流程和socket简单操作
查看>>
ProbS CF matlab源代码(二分系统)(原创作品,转载注明出处,谢谢!)
查看>>
OC中KVC的注意点
查看>>
JQ入门(至回调函数)
查看>>
【洛天依】几首歌的翻唱(无伴奏)
查看>>
OpenSSL初瞻及本系列的博文的缘由
查看>>
ISO8583接口的详细资料
查看>>
tmux不自动加载配置文件.tmux.conf
查看>>
[MOSEK] Stupid things when using mosek
查看>>
程序实例---栈的顺序实现和链式实现
查看>>
服务的使用
查看>>
Oracle 用户与模式
查看>>
MairDB 初始数据库与表 (二)
查看>>
拥在怀里
查看>>