控件通用

和 10.0 区别：

新增 getType、setWaterMark、setPopupStyle 接口

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

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

示例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实现日期控件查询天数控制

示例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

value：需要赋的值

是否可用，布尔型

true：可用

false：不可用

不填时，默认为false

示例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 及之后版本，标题组件 也支持 setValue() 接口，用法与示例 6 一致。

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

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

示例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

示例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

是否可见，布尔型

• true：可见

• false：不可见

示例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根据条件显示参数控件

-

是否可见，布尔型

• 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

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

是否可用，布尔型

true：可用

false：不可用

示例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实现填报控件只能填写一次

-

是否可用，布尔型

• 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

-

示例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实现清空控件内容

-

示例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

水印文字，字符串

示例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

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

示例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');

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

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

PopupStyle:{

    itemHeight: string;
    fontSize: string;
}

PopupStyle：弹出框样式，json 格式

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

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

示例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;

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

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

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