添加链接 注册    登录
link管理
链接快照平台
  • 输入网页链接，自动生成快照
  • 标签化管理网页链接
相关文章推荐
面冷心慈的汉堡包  ·  Axure动态面板：实现图片缩放和进度条加载 ...·  1 月前    · 
傻傻的烤面包  ·  使用Selenium单击“加载更多”按钮，直 ...·  3 月前    · 
打盹的课本  ·  起底小米生态链：8年投资500+，近30家成 ...·  3 月前    · 
安静的课本  ·  文化十分丨十年磨一剑 ...·  4 月前    · 
打酱油的香蕉  ·  split()过滤引号中的逗号_ts ...·  4 月前    · 
英俊的铁板烧  ·  Cursor是编码界的ChatGPT—每个人 ...·  4 月前    · 
link管理  ›  控件通用- FineReport帮助文档 - 全面的报表使用教程和学习资料
下拉框 可视化 显示接口 移动互联网终端
https://help.fanruan.com/finereport/doc-view-4261.html
精明的皮带
5 月前
版本 功能变动
11.0

和 10.0 区别：

新增 getType 、 setWaterMark、 setPopupStyle 接口

11.0.7

FineVis数据可视化 V1.5.0 版本新增 控件组件 ，适配部分接口

与普通报表和决策报表的区别：需要将 _g().xxx 替换为 duchamp.xxx

11.0.11 APP/HTML5 11.0.76 及以后版本，return false 接口部分支持移动端

在使用接口前，请务必先仔细阅读 JS API 兼容说明 ，接口默认支持普通报表和决策报表（新版）。

getValue

方法 getValue()

获取控件的实际值

参数 - -
返回值 any
示例

示例1：若取到的控件对象定义为 widget，获取控件的实际值 

widget.getValue();

示例2：获取参数面板上 text0 控件的实际值 

_g().getParameterContainer().getWidgetByName("text0").getValue();

示例3：普通报表中获取填报单元格中 text0 控件的实际值 

_g().getWidgetByName("text0").getValue();

示例4：决策报表中获取 body 中 text0 控件的实际值 

新自适应：_g().getWidgetByName("text0").getValue();
旧自适应：_g().getParameterContainer().getWidgetByName("text0").getValue();

示例5：FVS 可视化看板中获取控件组件 text0 的实际值 

duchamp.getWidgetByName("text0").getValue();

注：FVS 插件 V1.16.0 及之后版本， 标题组件 也支持 getValue() 接口，用法与示例 5 一致。

应用示例

获取日期控件的值，当开始时间和结束时间相差大于 30 天时，弹窗提醒：

详细实现方法可参考： JS实现日期控件查询天数控制

2021-09-06_11-08-34.gif

移动端 支持移动端

getText

方法 getText()

获取控件的显示值

参数 - -
返回值 string
示例

示例1：若获取到的控件对象定义为 widget，获取控件的显示值 

widget.getText();

示例2：获取参数面板上 text0 控件的显示值 

_g().getParameterContainer().getWidgetByName("text0").getText();

示例3：普通报表中获取填报单元格中 text0 控件的显示值 

_g().getWidgetByName("text0").getText();

示例4：决策报表中获取 body 中 text0 控件的显示值 

_g().getWidgetByName("text0").getText();

示例5：FVS 可视化看板中获取控件组件 text0 的显示值 

duchamp.getWidgetByName("text0").getText();
应用示例

下拉框选择值后，打印其实际值和显示值：

点击可下载模板： 获取控件显示值.cpt

2021-11-01_15-34-34.gif


移动端 支持移动端

setValue

方法 setValue(value,boolean) 设置控件的值
参数

value：需要赋的值

控件值，任意格式

boolean：触发联动

是否可用，布尔型

true：可用

false：不可用

不填时，默认为false

返回值 void
示例

示例1：若获取到的控件对象定义为 widget，设置控件的值为“文本” 

widget.setValue('文本');

示例2：获取参数面板上控件 text0 ，将其控件值设置为“文本” 

_g().getParameterContainer().getWidgetByName("text0").setValue('文本');

示例3：普通报表中获取填报单元格中 text0 控件，将其控件值设置为“文本” 

_g().getWidgetByName("text0").setValue('文本');

示例4：决策报表中获取 body 中 text0 控件，将其控件值设置为“文本” 

_g().getWidgetByName("text0").setValue('文本');

示例5：普通报表中给参数面板上的下拉复选框赋多个值： 

_g().getParameterContainer().getWidgetByName("comboCheckBox0").setValue("孙阳,孙林");

示例6：FVS 可视化看板中获取控件组件 text0 ，将其控件值设置为“文本” 

duchamp.getWidgetByName("text0").setValue('文本');

注：FVS 插件 V2.4.1 及之后版本 ， 标题组件 也支持 s etValue() 接口，用法与示例 6 一致。

应用示例

点击按钮，给日期控件设置合适的值：

详细实现方法可参考： JS实现自定义按钮快速给参数赋指定范围值

2021-09-06_13-43-31.gif

移动端 支持移动端

visible

注：FVS 可视化看板不支持 visible 。

方法 visible() 设置控件可见
参数 - -
返回值 void
示例

示例1：若获取到的控件对象定义为 widget，设置其可见 

widget.visible();

示例2：获取参数面板上控件 text0 ，设置其可见 

_g().getParameterContainer().getWidgetByName("text0").visible();

示例3：普通报表中获取填报单元格中 text0 控件，设置其可见 

_g().getWidgetByName("text0").visible();

示例4：决策报表中获取 body 中 text0 控件，设置其可见 

_g().getWidgetByName("text0").visible();
应用示例

点击按钮，显示参数面板中的部分控件：

点击可下载模板： 设置控件值可见.cpt

2021-11-01_15-50-37.gif

移动端 支持移动端，FVS 可视化看板不支持该接口

invisible

注：FVS 可视化看板不支持 invisible 。

方法 invisible() 设置控件不可见
参数 - -
返回值 void
示例

示例1：若获取到的控件对象定义为 widget，设置其不可见 

widget.invisible();

示例2：获取参数面板上控件 text0 ，设置其不可见 

_g().getParameterContainer().getWidgetByName("text0").invisible();

示例3：普通报表中获取填报单元格中 text0 控件，设置其不可见 

_g().getWidgetByName("text0").invisible();

示例4：决策报表中获取 body 中 text0 控件，设置其不可见 

_g().getWidgetByName("text0").invisible();
应用示例

点击按钮，隐藏参数面板中部分控件：

点击可下载模板： 设置控件值不可见.cpt

2021-09-06_15-22-47.gif

移动端 支持移动端，FVS 可视化看板不支持该接口

setVisible

方法 setVisible(visibility) 设置控件可见/不可见
参数 visibility: boolean

是否可见，布尔型

  • true：可见

  • false：不可见

返回值 void
示例

示例1：若获取到的控件对象定义为 widget，设置其不可见 

widget.setVisible(false);

示例2：获取参数面板上控件 text0 ，设置其不可见 

_g().getParameterContainer().getWidgetByName("text0").setVisible(false);

示例3：普通报表中获取填报单元格中 text0 控件，设置其不可见 

_g().getWidgetByName("text0").setVisible(false);

示例4：决策报表中获取 body 中 text0 控件，设置其不可见 

_g().getWidgetByName("text0").setVisible(false);

示例5：FVS 可视化看板中获取控件组件 text0 ，设置其不可见 

duchamp.getWidgetByName("text0").setVisible(false);
应用示例

只有前面的下拉框选择了内容之后，后一层下拉框控件才显示出来：

详细实现 方法可参考： JS根据条件显示参数控件

2021-09-06_14-31-32.gif

移动端 移动端部分支持，报表填报单元格中的控件不支持

isVisible

方法 isVisible() 控件是否可见
参数 -

-

返回值 boolean

是否可见，布尔型

  • true：可见

  • false：不可见

示例

示例1：若获取到的控件对象定义为 widget，返回其是否可见 

widget.isVisible();

示例2：获取参数面板上控件 text0 ，返回其是否可见 

_g().getParameterContainer().getWidgetByName("text0").isVisible();

示例3：普通报表中获取填报单元格中 text0 控件，返回其是否可见 

_g().getWidgetByName("text0").isVisible();

示例4：决策报表中获取 body 中 text0 控件，返回其是否可见 

_g().getWidgetByName("text0").isVisible();

示例5：FVS 可视化看板中获取控件组件 text0 ，返回其是否可见 

duchamp.getWidgetByName("text0").isVisible();
应用示例

省份控件选择值后，查询按钮显示；否则，查询按钮不显示：

点击可下载模板： 控件是否可见.cpt

2021-09-07_10-21-47.gif

移动端

移动端部分支持，报表填报单元格中的控件不支持

setEnable

方法 setEnable(enabled) 设置控件可用/不可用
参数 enabled: boolean

是否可用，布尔型

true：可用

false：不可用

返回值 void
示例

示例1：若获取到的控件对象定义为 widget，设置其不可用 

widget.setEnable(false);

示例2：获取参数面板上控件 text0 ，设置其不可用 

_g().getParameterContainer().getWidgetByName("text0").setEnable(false);

示例3：普通报表中获取填报单元格中 text0 控件，设置其不可用 

_g().getWidgetByName("text0").setEnable(false);

示例4：决策报表中获取 body 中 text0 控件，设置其不可用 

_g().getWidgetByName("text0").setEnable(false);

示例5：FVS 可视化看板中获取控件组件 text0 ，设置其不可用 

duchamp.getWidgetByName("text0").setEnable(false);
应用示例

成绩只能选择一次，选择后将控件设置为不可用 ：

详细实现方法可参考： JS实现填报控件只能填写一次

2021-09-07_10-46-26.gif

移动端 移动端部分支持，报表填报单元格中的控件不支持

isEnabled

方法 isEnabled() 控件是否可用
参数 -

-

返回值 boolean

是否可用，布尔型

  • true：可用

  • false：不可用

示例

示例1：若获取到的控件对象定义为 widget，返回其是否可用 

widget.isEnabled();

示例2：获取参数面板上控件 text0 ，返回其是否可用 

_g().getParameterContainer().getWidgetByName("text0").isEnabled();

示例3：普通报表中获取填报单元格中 text0 控件，返回其是否可用 

_g().getWidgetByName("text0").isEnabled();

示例4：决策报表中获取 body 中 text0 控件，返回其是否可用 

_g().getWidgetByName("text0").isEnabled();

示例5：FVS 可视化看板中获取控件组件 text0 ，返回其是否可用 

duchamp.getWidgetByName("text0").isEnabled();
应用示例

省份控件选择值后，查询按钮可用；否则，查询按钮不可用：

点击可下载模板： 控件是否可用.cpt

2021-09-07_11-12-54.gif

移动端 移动端部分支持，报表填报单元格中的控件不支持

reset

方法 reset() 重置控件、清空控件的内容
参数 -

-

返回值 void
示例

示例1：若获取到的控件对象定义为 widget，清空控件的内容 

widget.reset();

示例2：获取参数面板上控件 text0 ，清空控件的内容 

_g().getParameterContainer().getWidgetByName("text0").reset();

示例3：普通报表中获取填报单元格中 text0 控件，清空控件的内容 

_g().getWidgetByName("text0").reset();

示例4：决策报表中获取 body 中 text0 控件，清空控件的内容 

_g().getWidgetByName("text0").reset();

示例5：FVS 可视化看板中获取控件组件 text0 ，清空控件的内容 

duchamp.getWidgetByName("text0").reset();
应用示例

点击按钮，清空所有控件值：

详细实现方法可参考： JS实现清空控件内容

2021-09-07_16-18-40.gif

移动端 支持移动端

getType

注：FVS 可视化看板不支持 getType 。

方法 getType() 获取控件类型
参数 -

-

返回值 string 字符串，返回默认的控件名称类型，如按钮为 button、下拉框为 comboBox
示例

示例1：若获取到的控件对象定义为 widget，返回其类型 

widget.getType();

示例2：获取参数面板上控件 text0 ，返回其类型 

_g().getParameterContainer().getWidgetByName("text0").getType();

示例3：普通报表中获取填报单元格中 text0 控件，返回其类型 

_g().getWidgetByName("text0").getType(); 

示例4：决策报表中获取 body 中 text0 控件，返回其类型 

_g().getWidgetByName("text0").getType();
应用示例

点击按钮获取控件类型 ：

点击可下载模板： 查看控件类型.cpt

2021-09-14_9-41-22.gif

移动端 支持移动端，FVS 可视化看板不支持该接口

setWaterMark

方法 setWaterMark(text) 添加水印文字（仅支持有输入框的控件）
参数 text: string

水印文字，字符串

返回值 void
示例

示例1：若获取到的控件对象定义为 widget，为其添加“请输入姓名”的水印 

widget.setWaterMark('请输入姓名');

示例2：获取参数面板上控件 text0 ，为其添加“请输入姓名”的水印 

_g().getParameterContainer().getWidgetByName("text0").setWaterMark('请输入姓名');

示例3：普通报表中获取填报单元格中 text0 控件，为其添加“请输入姓名”的水印 

_g().getWidgetByName("text0").setWaterMark('请输入姓名');

示例4：决策报表中获取 body 中 text0 控件，为其添加“请输入姓名”的水印 

_g().getWidgetByName("text0").setWaterMark('请输入姓名');

注：添加事件后由于报表块对象没有完全创建导致报错后，可以添加一个延迟函数延迟执行，如： 

setTimeout(function(){
    _g().getParameterContainer().getWidgetByName("text0").
    setWaterMark('请输入姓名');
}, 500);

示例5：FVS 可视化看板中获取控件组件 text0 ，为其添加“请输入姓名”的水印 

duchamp.getWidgetByName("text0").setWaterMark('请输入姓名');
应用示例

给文本框控件添加水印 ：

点击可下载模板： 控件水印.cpt

移动端 支持移动端

fireEvent

注：FVS 可视化看板不支持 fireEvent 。

方法 fireEvent(eventName); 调用控件事件
参数 eventName: string

事件类型，字符串， 值可 参考： 控件事件 ，如「初始化后」事件为 afterinit

返回值 void
示例

示例1：若获取到的控件对象定义为 widget，触发控件的「初始化后」事件 

widget.fireEvent('afterinit');

示例2：获取参数面板上控件 text0 ，触发其「初始化后」事件 

_g().getParameterContainer().getWidgetByName("text0").fireEvent('afterinit');

示例3：普通报表中获取填报单元格中 text0 控件，触发其「初始化后」事件 

_g().getWidgetByName("text0").fireEvent('afterinit');

示例4：决策报表中获取 body 中 text0 控件，触发其「初始化后」事件 

_g().getWidgetByName("text0").fireEvent('afterinit');
应用示例

决策报表中，点击按钮给日期控件赋值，同时触发日期控件的「 编辑后 」事件提交参数查询：

详细实现方法可参考： 查询不同时间周期的数据

2021-09-07_14-36-55.gif

移动端 支持移动端，FVS 可视化看板不支持该接口

setPopupStyle

注：FVS 可视化看板不支持 setPopupStyle 。

方法

setPopupStyle(PopupStyle)

设置控件下拉选项框的样式，仅支持有选项框的控件，如下拉框、下拉复选框

参数

PopupStyle:{

itemHeight: string;
fontSize: string;
}

PopupStyle：弹出框样式，json 格式

  • itemHeight：弹出框中选项的高度

  • fontSize:：弹出框中字体大小

返回值 void
示例

示例1：若获取到的下拉框控件对象定义为 widget，设置其弹出框选项高度为 30px、字体大小为 20px 

widget.setPopupStyle({
    itemHeight:"30px",
    fontSize:"20px"
});

示例2：获取参数面板上下拉框控件 comboBox0 ，设置其弹出框选项高度为 30px、字体大小为 20px 

widget.setPopupStyle({
    itemHeight:"30px",
    fontSize:"20px"
});

示例3：普通报表中获取填报单元格中下拉框控件 comboBox0，设置其弹出框选项高度为 30px、字体大小为 20px 

_g().getWidgetByName("comboBox0").setPopupStyle({
    itemHeight:"10px",
    fontSize:"10px"
});

示例4：决策报表中获取 body 中下拉框控件 comboBox0，设置其弹出框选项高度为 30px、字体大小为 20px 

_g().getWidgetByName("comboBox0").setPopupStyle({
    itemHeight:"30px",
    fontSize:"20px"
});

注：添加事件后由于报表块对象没有完全创建导致报错后，可以添加一个延迟函数延迟执行，如： 

setTimeout(function(){
_g().getParameterContainer().getWidgetByName("comboBox0").setPopupStyle({
    itemHeight: "10px",
    fontSize: "10px"
});
}, 500);
应用示例

设置「下拉框」下拉选项框选项高度为 30px、字体大小为 20px：

点击了下载模板： 控件样式.cpt

移动端 不支持移动端

return false

注：FVS 可视化看板不支持 return false 。

方法 -

事件中加入 return false，用于阻塞后续动作执行，如给查询按钮加一个事件用来阻止其查询。

参数 -

-

返回值 -
示例

给决策报表的下拉复选框控件，添加一个「编辑后」事件，事件内容为： 

return false;
应用示例

给查询按钮加一个阻止查询事件，当地区选择华东时不查询，选择华北时查询：

2023-01-06_16-06-18.gif

点击可下载模板： 查询按钮选择性查询.cpt

移动端

报表服务器 11.0.11 且 APP\H5  11.0.76 及以上版本，移动端支持使用该接口，但不支持「阻止触发联动」的功能，比如阻止决策报表 body 中控件选完值后的默认查询。


 
推荐文章
面冷心慈的汉堡包  ·  Axure动态面板：实现图片缩放和进度条加载效果 – Axure中文学习网
1 月前
傻傻的烤面包  ·  使用Selenium单击“加载更多”按钮，直到该按钮不存在(Youtube)_使用selenium单击按钮并查看更多文本_如何使用Selenium Python单击按钮查看更多值？ - 腾讯云开发者社
3 月前
打盹的课本  ·  起底小米生态链：8年投资500+，近30家成功上市，多家排队IPO
3 月前
安静的课本  ·  文化十分丨十年磨一剑 《四世同堂》历久弥新_新闻_央视网(cctv.com)
4 月前
打酱油的香蕉  ·  split()过滤引号中的逗号_ts split-CSDN博客
4 月前
英俊的铁板烧  ·  Cursor是编码界的ChatGPT—每个人都能在几分钟内制作应用程序_手机搜狐网
4 月前
Link管理   ·   51好读   ·   Sov5搜索   ·   小百科
link管理 - 链接快照平台