JavaScript in custom widgets

JavaScript functions can be embedded in custom widgets.

After doing a double click on the custom widget and clicked on the padlock, the edit mode is active and it is possible to associate the JavaScript code to the available events.

Note the usage of the operator this. that is necessary to allow the multiple instance of the custom widget.

If you need to reference to an element of the widget, you can use the keyword wgt.. For example, use wgt.id to reference at the id of the active widget instance.

If you cut and paste some instances of the custom widget of the above example and execute it, e.g. inside the simulator, you will obtain the below result.

onActivate property

To initialize the custom widget is possible to define the onActive property with an initializing function as for the below example.

The onActivate() function will be execute when the page is loading

Note that the custom widget can also past inside the User’s Gallery for later reuse.

 

The JavaScript code used inside the examples of this chapter

/*! javascript module: widget-1.0.js javascript source file path: lib\com\example\widget-1.0\widget-1.0.js */ this.wMSG = wgt.getWidget(wgt.id+".field1") this.BtnStd1_btn_onMouseClick = function (me, eventInfo) { var now = new Date(); this.wMSG.setProperty("value", now.toString().slice(0, 24)); } this.onActivate = function() { this.wMSG.setProperty("value", "Button never pressed"); }; this.onActivate();