General API for Widgets

11.0

Differences from V10.0:

The getType, setWaterMark, and setPopupStyle interfaces were added.

11.0.7

The FVS Dashboard Edit Mode plugin of V1.5.0 added widget components, adapting to some interfaces.

Difference from ordinary reports and dashboards:

_g().xxx needs to be replaced with duchamp.xxx.

11.0.11

For App/HTML5 V11.0.76 and later versions, the return false interface is partially supported on mobile terminals.

Parameter

/

/

Return Value

any

Example

One: If the obtained widget object is defined as widget, obtain the actual value of the widget.

widget.getValue();

Two: Obtain the actual value of the text0 widget on the parameter panel.

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

Three: Obtain the actual value of the text0 widget in the data entry cell in a report.

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

Four: Obtain the actual value of the text0 widget in the body page of a dashboard.

New Adaptive: _g().getWidgetByName("text0").getValue();
Old Adaptive: _g().getParameterContainer().getWidgetByName("text0").getValue();

Five: Obtain the actual value of the text0 widget component in an FVS dashboard template.

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

Note:

In the FVS Dashboard Edit Mode plugin V1.16.0 and later versions, the title component also supports the getValue() interface, which has the same usage as Example Five.

Application Example

Obtain the value of the date widget. When the interval between the start time and end time is   more than 30 days, a prompt box pops up as shown in the following figure.

Mobile Terminal

It is supported on mobile terminals.

Parameter

/

/

Return Value

string

Example

One: If the obtained widget object is defined as widget, obtain the display value of the widget.

widget.getText();

Two: Obtain the display value of the text0 widget on the parameter panel.

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

Three: Obtain the display value of the text0 widget in the data entry cell in a report.

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

Four: Obtain the display value of the text0 widget in the body page of a dashboard.

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

Five: Obtain the display value of the text0 widget component in an FVS dashboard template.

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

Application Example

After a value is selected from the drop-down box, print its actual value and display value.

Click to download the template: Obtain Widget Display Value.cpt

Mobile Terminal

It is supported on mobile terminals.

Parameter

value: any

Widget value in any format

Return Value

void

Example

One: If the obtained widget object is defined as widget, set the widget value to Text.

widget.setValue('Text');

Two: Obtain the text0 widget on the parameter panel and set the widget value to Text.

_g().getParameterContainer().getWidgetByName("text0").setValue('Text');

Three: Obtain the text0 widget in the data entry cell in a report and set the widget value to Text.

_g().getWidgetByName("text0").setValue('Text');

Four: Obtain the text0 widget in the body page of a dashboard and set the widget value to Text.

_g().getWidgetByName("text0").setValue('Text');

Five: Assign multiple values to the drop-down checkbox on the parameter panel in an ordinary report.

_g().getParameterContainer().getWidgetByName("comboCheckBox0").setValue("John,Tom");

Six: Obtain the text0 widget component in the FVS dashboard template and set the widget value to Text.

duchamp.getWidgetByName("text0").setValue('Text');

Application Example

Click different buttons to set different values for date widgets.

Mobile Terminal

It is supported on mobile terminals.

Parameter

/

/

Return Value

void

Example

One: If the obtained widget object is defined as widget, set the widget visible.

widget.visible();

Two: Obtain the text0 widget on the parameter panel and set the widget visible.

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

Three: Obtain the text0 widget in the data entry cell in a report and set the widget visible.

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

Four: Obtain the text0 widget in the body page of a dashboard and set the widget visible.

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

Application Example

Click the button to display some widgets on the parameter panel.

Click to download the template: Set Widget Visible.cpt

Mobile Terminal

It is supported on mobile terminals, but not supported in FVS dashboard templates.

Parameter

/

/

Return Value

void

Example

One: If the obtained widget object is defined as widget, set the widget invisible.

widget.invisible();

Two: Obtain the text0 widget on the parameter panel and set the widget invisible.

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

Three: Obtain the text0 widget in the data entry cell in a report and set the widget invisible.

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

Four: Obtain the text0 widget in the body page of a dashboard and set the widget invisible.

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

Application Example

Click the button to hide some widgets on the parameter panel.

Click to download the template: Set Widget Invisible.cpt

Mobile Terminal

It is supported on mobile terminals, but not supported in FVS dashboard templates.

Parameter

visibility: boolean

Whether it is visible or not (Boolean)

• true: visible

• false: invisible

Return Value

void

Example

One: If the obtained widget object is defined as widget, set the widget invisible.

widget.setVisible(false);

Two: Obtain the text0 widget on the parameter panel and set the widget invisible.

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

Three: Obtain the text0 widget in the data entry cell in a report and set the widget invisible.

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

Four: Obtain the text0 widget in the body page of a dashboard and set the widget invisible.

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

Five: Obtain the text0 widget component in an FVS dashboard template and set the widget invisible.

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

Application Example

Only after the content is selected in the previous drop-down box, the subsequent drop-down box is displayed as shown in the following figure.

Mobile Terminal

It is partly supported on mobile terminals, but not supported for the widgets in the data entry cell in a report.

Parameter

/

/

Return Value

boolean

Whether it is visible or not (Boolean)

• true: visible

• false: invisible

Example

One: If the obtained widget object is defined as widget, return that the widget is visible/invisible.

widget.isVisible();

Two: Obtain the text0 widget on the parameter panel and return that the widget is visible/invisible.

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

Three: Obtain the text0 widget in the data entry cell in a report and return that the widget is visible/invisible.

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

Four: Obtain the text0 widget in the body page of a dashboard and return that the widget is visible/invisible.

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

Five: Obtain the text0 widget component in an FVS dashboard template and return that the widget is visible/invisible.

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

Application Example

After a city in the widget is selected, the query button is displayed. Otherwise, the query   button is not displayed.

Click to download the template: Widget Visible or Not.cpt

Mobile Terminal

It is partly supported on mobile terminals, but not supported for the widgets in the data entry cell in a report.

Parameter

enabled: boolean

Whether it is enabled or not (Boolean)

• true: enabled

• false: disabled

Return Value

void

Example

One: If the obtained widget object is defined as widget, set the widget disabled.

widget.setEnable(false);

Two: Obtain the text0 widget on the parameter panel and set the widget disabled.

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

Three: Obtain the text0 widget in the data entry cell in a report and set the widget disabled.

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

Four: Obtain the text0 widget in the body page of a dashboard and set the widget disabled.

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

Five: Obtain the text0 widget component in an FVS dashboard template and set the widget disabled.

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

Application Example

The position can only be selected once. After selection, the widget would become disabled.

Click to download the template: setEnable.cpt

Mobile Terminal

It is partly supported on mobile terminals, but not supported for the widgets in the data entry cell in a report.

Parameter

/

/

Return Value

boolean

Whether it is enabled or not (Boolean)

• true: enabled

• false: disabled

Example

One: If the obtained widget object is defined as widget, return that the widget is enabled/disabled.

widget.isEnabled();

Two: Obtain the text0 widget on the parameter panel and return that the widget is enabled/disabled.

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

Three: Obtain the text0 widget in the data entry cell in a report and return that the widget is enabled/disabled.

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

Four: Obtain the text0 widget in the body page of a dashboard and return that the widget is enabled/disabled.

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

Five: Obtain the text0 widget component in an FVS dashboard template and return that the widget is enabled/disabled.

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

Application Example

After a city in the widget is selected, the query button is enabled. Otherwise, the query button is disabled.

Click to download the template: Widget Enabled or Not.cpt

Mobile Terminal

It is partly supported on mobile terminals, but not supported for the widgets in the data entry cell in a report.

Parameter

/

/

Return Value

void

Example

One: If the obtained widget object is defined as widget, clear the widget content.

widget.reset();

Two: Obtain the text0 widget on the parameter panel and clear the widget content.

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

Three: Obtain the text0 widget in the data entry cell in a report and clear the widget content.

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

Four: Obtain the text0 widget in the body page of a dashboard and clear the widget content.

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

Five: Obtain the text0 widget component in an FVS dashboard template and clear the widget content.

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

Application Example

Click the button to clear all widget values.

Click to download the template: Reset the Widget Value.cpt

Mobile Terminal

It is supported on mobile terminals.

Parameter

/

/

Return Value

string

Returns the default widget type, such as button for button and drop-down box for comboBox.

Example

One: If the obtained widget object is defined as widget, return the widget type.

widget.getType();

Two: Obtain the text0 widget on the parameter panel and return the widget type.

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

Three: Obtain the text0 widget in the data entry cell in a report and return the widget type.

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

Four: Obtain the text0 widget in the body page of a dashboard and return the widget type.

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

Application Example

Click the button to obtain the widget type.

Click to download the template: View Widget Type.cpt

Mobile Terminal

It is supported on mobile terminals, but not supported in FVS dashboard templates.

Param

ter

text: string

Watermark text

Return Value

void

Exam

ple

One: If the obtained widget object is defined as widget, add the watermark "Enter the name" to the widget.

widget.setWaterMark('Enter the name');

Two: Obtain the text0 widget on the parameter panel and add the watermark "Enter the name" to the widget.

_g().getParameterContainer().getWidgetByName("text0").setWaterMark('Enter the name');

Three: Obtain the text0 widget in the data entry cell in a report and add the watermark "Enter the name" to the widget.

_g().getWidgetByName("text0").setWaterMark('Enter the name');

Four: Obtain the text0 widget in the body page of a dashboard and add the watermark "Enter the name" to the widget.

_g().getWidgetByName("text0").setWaterMark('Enter the name');

Note:

After adding an event, you can add a delay function to delay the execution in case of an error due to incomplete creation of the report block object.

setTimeout(function(){
    _g().getParameterContainer().getWidgetByName("text0").
    setWaterMark('Enter the name');
}, 500);

Five: Obtain the text0 widget component in an FVS dashboard template and add the watermark "Enter the name" to the widget.

duchamp.getWidgetByName("text0").setWaterMark('Enter the name');

Applica

tion 

Exam

ple

Add watermark to the text box widget as shown in the following figure.

Click to download the template: Widget Watermark.cpt

Mobile Terminal

It is supported on mobile terminals.

Parameter

eventName: string

Event type

For details about values, see Widget Event. For example, the After Initialization event is afterinit.

Return Value

void

Example

One: If the obtained widget object is defined as widget, trigger the After Initialization event of the widget.

widget.fireEvent('afterinit');

Two: Obtain the text0 widget on the parameter panel and trigger the After Initialization event of the widget.

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

Three: Obtain the text0 widget in the data entry cell in a report and trigger the After Initialization event of the widget.

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

Four: Obtain the text0 widget in the body page of a dashboard and trigger the After Initialization event of the widget.

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

Application Example

In a dashboard, click the button to assign a value to the date widget, and trigger the After Editing event of the date widget to submit parameter query simultaneously.

Mobile Terminal

It is supported on mobile terminals, but not supported in FVS dashboard templates.

Parameter

PopupStyle:{

      itemHeight: string;    

      fontSize: string;

}

PopupStyle: Pop-uping the box style, JSON format

itemHeight: Height of the options in the pop-up box

fontSize: Font size in the pop-up box

Return Value

void

Example

One: If the obtained drop-down box widget object is defined as widget, set the height of drop-down options in the widget to 30px   and font size to 20px.

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

Two: Obtain the text0 widget on the parameter panel and set the height of drop-down options in the widget to 30px and font size to 20px.

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

Three: Obtain the text0 widget in the data entry cell in a report and set the height of drop-down options in the widget to 30px and font size to 20px.

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

Four: Obtain the text0 widget in the body page of a dashboard and set the height of drop-down options in the widget to 30px and font size to 20px.

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

Note:

After adding an event, you can add a delay function to delay the execution in case of an error due to incomplete creation of the report block object.

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

Application Example

Set the height of drop-down options in the widget to 30px and font size to 20px.

Click to download the template: Widget Style.cpt

Mobile Terminal

It is not supported on mobile terminals.

Parameter

/

/

Return Value

/

Example

Add an After Editing event to the drop-down checkbox widget for a dashboard, with the event content shown as below.

return false;

Application Example

Add a blocking event to the query button. When the region is selected as Indonesia, the query fails. While the region is selected as Malaysia, the query succeeds.

Click to download the template: Selective Query.cpt

Mobile Terminal

In Report Server V11.0.11 as well as App\HTML5 V11.0.76 and later versions, mobile terminals support the use of the return false interface, but do not support the function of preventing triggering linkage, such as preventing the default query after a value is selected in the widget in the body page of a dashboard.