反饋已提交

網絡繁忙

當前為10.0版本文檔,更多實例內容將在最新幫助文檔中展現,點選跳轉至 最新版幫助文檔

元件通用

一、概述

  1. 本文介紹的是元件通用的JS API方法。

二、API說明

1
【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();


應用範例

獲取日期元件的值,當開始時間和結束時間相差大於 30 天時,彈窗提醒。

詳細實現方法可參考:JS實現日期元件查詢天數控制

1.gif

 

  行動端

支援行動端。


2
【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();


應用範例

下拉框選擇值後,打印其實際值和顯示值:

點選可下載範本:獲取元件顯示值.cpt

2.gif

行動端

支援行動端。

3
【setValue】

方法

setValue(value)

設定元件的值。

參數

value: any

元件值,任意格式。

傳回值

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('文本');

應用範例

點選按鈕,給日期元件設定合适的值:

詳細實現方法可參考:JS實現自定義按鈕快速給參數賦指定範圍值

3.gif

行動端

支援行動端。


4
【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

1642039550194297.gif 

行動端

支援行動端。

5
【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

5.gif

 

行動端

支援行動端。

6
【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);


應用範例

只有前面的下拉框選擇了内容之後,後一層下拉框元件才顯示出來:

詳細實現方法可參考:JS根據條件顯示參數元件

6.gif

行動端

支援行動端。


7
【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();


應用範例

省份元件選擇值後,查詢按鈕顯示;否則,查詢按鈕不顯示:

點選可下載範本:元件是否可見.cpt

7.gif

行動端

支援行動端。

8
【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);

應用範例

成績只能選擇一次,選擇後将元件設定為不可用:

詳細實現方法可參考:JS實現填報元件只能填寫一次

8.gif

行動端

支援行動端。

9
【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();

應用範例

省份元件選擇值後,查詢按鈕可用;否則,查詢按鈕不可用:

點選可下載範本:元件是否可用.cpt

9.gif

   行動端

支援行動端。

10
【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();

應用範例

點選按鈕,清空所有元件值:

詳細實現方法可參考:JS實現清空元件内容

10.gif

   行動端

支援行動端。

11
【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

11.gif

行動端

支援行動端。

12
【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);


應用範例

給文本框元件添加水印:

點選可下載範本:元件水印.cpt

12.jpg

行動端

支援行動端。

13
【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');

應用範例

決策報表中,點選按鈕給日期元件賦值,同時觸發日期元件的【編輯後】事件提交參數查詢:

詳細實現方法可參考:查詢不同時間周期的數據

13.gif

行動端

支援行動端。

14
【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

14.jpg

行動端

不支援行動端。


15
【return false】

方法

-

在元件的特定事件中加入 return false,不觸發聯動、查詢。

參數

-

-

傳回值

-

範例

給決策報表的下拉複選框元件,添加一個【編輯後】事件,事件内容為:

return false;


應用範例

決策報表 body 裏添加的元件在輸入值後會立即觸發查詢動作如下圖1:

如果想要實現輸入值後點選按鈕才開始查詢,可以通過給下拉框元件添加事件不觸發查詢如下圖2:

點選可下載範本:下拉框選擇值後不觸發查詢.frm

15.gif

16.gif


行動端

不支援行動端。

 


附件列表


主題: 11.0新增功能
已經是第一篇
已經是最後一篇
  • 有幫助
  • 沒幫助
  • 只是瀏覽
  • 圖片不清晰
  • 用語看不懂
  • 功能說明看不懂
  • 操作說明太簡單
  • 內容有錯誤

文 檔回 饋

滑鼠選中內容,快速回饋問題

滑鼠選中存在疑惑的內容,即可快速回饋問題,我們將會跟進處理。

不再提示

10s後關閉