JS实现点击参数面板按钮显示或隐藏数据

jeyhan 发布于2019-08-21 11:31 / 844人阅读

摘要：当报表中列出数据太多时，想通过显示按钮隐藏明细数据只显示统计数据。如下图示例，那么该如何实现呢本文以为例，来讲述如何实现点击参数面板按钮显示或隐藏数据。打开报表在参数面板添加一个标签控件，控件名为，设置标签控件不可见，控件值为显示。

当报表中列出数据太多时，想通过显示按钮隐藏明细数据只显示统计数据。如下图示例，那么该如何实现呢？本文以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 = "隐藏"。

保存模板，点击分页预览即可看到上图的效果。

云服务器 GPU云服务器 js点击按钮事件显示数据 js点击按钮后隐藏 js隐藏点击显示出来 js实现按钮点击

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/86798.html

怎样实现一个datePicker（日期选择）组件

摘要：百度前端技术学院上有一个任务，要实现一个日期选择组件，本文由此而来看看需求组件默认一直呈显示状态通过某种方式选择年月，选择了年月后，日期列表做相应切换通过单击某个具体的日期进行日期选择组件初始化时，可配置可选日期的上下限。百度前端技术学院上有一个任务，要实现一个日期选择组件，本文由此而来~ 看看需求组件默认一直呈显示状态通过某种方式选择年、月，选择了年月后，日期列表做相应切换 ...

layman 2019-08-30 13:04 评论0 收藏0
怎样实现一个datePicker（日期选择）组件

摘要：百度前端技术学院上有一个任务，要实现一个日期选择组件，本文由此而来看看需求组件默认一直呈显示状态通过某种方式选择年月，选择了年月后，日期列表做相应切换通过单击某个具体的日期进行日期选择组件初始化时，可配置可选日期的上下限。百度前端技术学院上有一个任务，要实现一个日期选择组件，本文由此而来~ 看看需求组件默认一直呈显示状态通过某种方式选择年、月，选择了年月后，日期列表做相应切换 ...

beanlam 2019-08-19 18:23 评论0 收藏0
【理解chrome开发者工具】 part1 编辑与调试

摘要：类似一个文本编辑器。显示请求瀑布流。基于平均水平的网络速度和设备性能作出的评估。方便开发者少用鼠标。而在面板中是打开具体文件。顾名思义，观察这个断点发生之前，被调用过的函数。在开发者工具的中，我们可以设置永久名单。简单复习各个面板 Elements 浏览DOM树，浏览样式。 Console 一个REPL。小技巧：在任何非Console面板中，按ESC可以调出一个小的Console...

Shisui 2019-08-23 18:01 评论0 收藏0
如何用原生JavaScript打造一款简易谷歌插件

摘要：今天，我打算向你们展示如何用原生做一款谷歌插件不依靠任何诸如或者框架的原生。我将向你们展示如何从零开始打造一款简易的谷歌插件。关于谷歌插件从本质上来说，一款谷歌插件只是一些用来定制浏览体验的文件。今天，我打算向你们展示如何用原生JavaScript做一款谷歌插件----不依靠任何诸如React、Angular或者Vue框架的原生JS。做一款谷歌插件并没有那么困难——在学习编程的第一...

Michael_Lin 2019-08-23 15:41 评论0 收藏0