历史版本5 :控件通用 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

getValue编辑

方法getValue()

获取控件的实际值

     参数--
   返回值any
     示例

将获取到的控件对象定义为 widget,获取控件的值:

widget.getValue();

获取参数面板上 text0 控件的控件值:

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

普通报表中获取填报单元格中 text0 控件的控件值:

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

决策报表中获取 body 中 text0 控件的控件值:

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

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

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

   移动端支持移动端

getText编辑

方法getText()

获取控件的显示值

     参数--
   返回值string
     示例

将获取到的控件对象定义为 widget,获取控件的显示值:

widget.getText();

获取参数面板上 text0 控件的显示值:

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

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

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

决策报表中获取 body 中 text0 控件的显示值:

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

下拉框切换不同季节,对应切换 Tab 页,Tab 页标题为下拉框选项的显示值:

2021-09-06_17-01-42.gif


   移动端支持移动端

setValue编辑

方法setValue(value)设置控件的值
     参数value: any控件值,任意格式
   返回值void
     示例

将获取到的控件对象定义为 widget,设置控件的值为“文本”

widget.setValue('文本');

获取参数面板上控件 text0 ,将其控件值设置为“文本”:

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

普通报表中获取填报单元格中 text0 控件,将其控件值设置为“文本”:

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

决策报表中获取 body 中 text0 控件,将其控件值设置为“文本”:

_g().getWidgetByName("text0").setValue('文本');
  应用示例

点击按钮,给日期控件设置合适的值:

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

   移动端支持移动端

visible编辑

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

将获取到的控件对象定义为 widget,设置其可见:

widget.visible();

获取参数面板上控件 text0 ,设置其可见:

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

普通报表中获取填报单元格中 text0 控件,设置其可见:

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

决策报表中获取 body 中 text0 控件,设置其可见:

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

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

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


   移动端支持移动端

invisible编辑

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

将获取到的控件对象定义为 widget,设置其不可见:

widget.invisible();

获取参数面板上控件 text0 ,设置其不可见:

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

普通报表中获取填报单元格中 text0 控件,设置其不可见:

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

决策报表中获取 body 中 text0 控件,设置其不可见:

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

点击按钮,隐藏参数面板中部分控件:

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


   移动端支持移动端

setVisible编辑

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

是否可见,布尔型

  • true:可见

  • false:不可见

   返回值void
     示例

将获取到的控件对象定义为 widget,设置其不可见:

widget.setVisible(false);

获取参数面板上控件 text0 ,设置其不可见:

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

普通报表中获取填报单元格中 text0 控件,设置其不可见:

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

决策报表中获取 body 中 text0 控件,设置其不可见:

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

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

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


   移动端支持移动端

isVisible编辑

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

-

   返回值boolean

是否可见,布尔型

  • true:可见

  • false:不可见

     示例

将获取到的控件对象定义为 widget,返回其是否可见:

widget.isVisible();

获取参数面板上控件 text0 ,返回其是否可见:

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

普通报表中获取填报单元格中 text0 控件,返回其是否可见:

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

决策报表中获取 body 中 text0 控件,返回其是否可见:

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

省份控件选择值后,查询按钮显示;否则,查询按钮不显示:

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

   移动端支持移动端

setEnable编辑

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

是否可用,布尔型

true:可用

false:不可用

   返回值void
     示例

将获取到的控件对象定义为 widget,设置其不可用:

widget.setEnable(false);

获取参数面板上控件 text0 ,设置其不可用:

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

普通报表中获取填报单元格中 text0 控件,设置其不可用:

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

决策报表中获取 body 中 text0 控件,设置其不可用:

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

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

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

   移动端支持移动端

isEnabled编辑

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

-

   返回值boolean

是否可用,布尔型

  • true:可见

  • false:不可见

     示例

将获取到的控件对象定义为 widget,返回其是否可用:

widget.isEnabled();

获取参数面板上控件 text0 ,返回其是否可用:

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

普通报表中获取填报单元格中 text0 控件,返回其是否可用:

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

决策报表中获取 body 中 text0 控件,返回其是否可用:

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

省份控件选择值后,查询按钮可用;否则,查询按钮不可用:

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

   移动端支持移动端

reset编辑

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

-

   返回值void
     示例

将获取到的控件对象定义为 widget,清空控件的内容:

widget.reset();

获取参数面板上控件 text0 ,清空控件的内容:

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

普通报表中获取填报单元格中 text0 控件,清空控件的内容:

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

决策报表中获取 body 中 text0 控件,清空控件的内容:

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

点击按钮,清空所有控件值:

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

   移动端支持移动端

getType编辑

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

-

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

将获取到的控件对象定义为 widget,返回其类型:

widget.getType(); 

获取参数面板上控件 text0 ,设置其不可用:

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

普通报表中获取填报单元格中 text0 控件,设置其不可用:

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

决策报表中获取 body 中 text0 控件,设置其不可用:

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

点击按钮获取控件类型

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

   移动端支持移动端

setWaterMark编辑

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

水印文字,字符串

   返回值void
     示例

将获取到的控件对象定义为 widget,为其添加“请输入姓名”的水印:

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

获取参数面板上控件 text0 ,设置其不可用:

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

普通报表中获取填报单元格中 text0 控件,设置其不可用:

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

决策报表中获取 body 中 text0 控件,设置其不可用:

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

给文本框控件添加水印

   移动端支持移动端

fireEvent编辑

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

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

   返回值void
     示例

将获取到的控件对象定义为 widget,触发控件的「初始化后」事件:

widget.fireEvent('afterinit');

获取参数面板上控件 text0 ,触发其「初始化后」事件:

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

普通报表中获取填报单元格中 text0 控件,触发其「初始化后」事件:

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

决策报表中获取 body 中 text0 控件,触发其「初始化后」事件:

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

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

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

    移动端支持移动端

setStyle编辑

方法setStyle(style);设置控件样式
     参数

style:{

    opacity: number,

    background: string,

    color: string,

    border: string,

    "border-radius": string

}

style:控件样式,json 格式

  • opacity:控件透明度,数字,范围: 0-1

  • background: 控件背景色

  • color: 字体颜色,字符串,常见颜色代码

  • border: 边框

  • border-radius: 边框圆角

   返回值void
     示例

将获取到的控件对象定义为 widget,设置控件字体黑色、透明度 0.3:

widget.setStyle({
    opacity:0.3,
    background:'transparent',
    color:'#000000'
});

获取参数面板上控件 text0 ,设置控件字体黑色、透明度 0.3:

_g().getParameterContainer().getWidgetByName("text0").setStyle({
     opacity:0.3,
    background:'transparent',
    color:'#000000'
});

普通报表中获取填报单元格中 text0 控件,设置控件字体黑色、透明度 0.3:

_g().getWidgetByName("text0").setStyle({
    opacity:0.3,
    background:'transparent',
    color:'#000000'
});

决策报表中获取 body 中 text0 控件,设置控件字体黑色、透明度 0.3:

_g().getWidgetByName("text0").setStyle({
    opacity:0.3,
    background:'transparent',
    color:'#000000'
});
  应用示例

修改文本控件的样式:

    移动端不支持移动端

setPopupStyle编辑

方法

setPopupStyle(PopupStyle)

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

     参数

PopupStyle:{

    itemHeight: string;
    fontSize: string;
}

PopupStyle:弹出框样式,json 格式

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

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

   返回值void
     示例

将获取到的下拉框控件对象定义为 widget,设置其弹出框选项高度为 30px、字体大小为 20px:

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

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

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

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

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

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

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

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

    移动端不支持移动端

return false编辑

方法-

在控件的特定事件中加入 return false,不触发联动、查询

     参数-

-

   返回值-
     示例

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

return false;
  应用示例

决策报表 body 里添加的控件在输入值后会立即触发查询动作:

2021-09-07_19-45-53.gif

如果想要实现输入值后点击按钮才开始查询,可以通过给下拉框控件添加事件不触发查询

2021-09-07_19-54-23.gif

    移动端不支持移动端

this.options.form编辑

方法

this.options.form

在控件的事件中调用,可以调用所有参数面板接口

     参数-

-

   返回值-
     示例

获取下拉框控件 comboBox0 的实际值:

this.options.form.getWidgetByName("comboBox0").getValue();
  应用示例

点击按钮,给日期控件设置合适的值:

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

    移动端

支持移动端