Implementation of Widget Response Actions

In addition to being used as a trigger of an event, a widget may further process a response action of the event. If a widget response is selected from the response actions, a corresponding action may be selected. Data refreshing and obtaining a value of a current input box are custom response actions of the widget. This section describes how to implement widget response actions.

Registering An Action

In the response action area, click the response action button to select an action from the drop-down list.

Figure 1 Response action

/**
* In the global_SelectWidget.js file, register the response action in the init hook.
* @params thisObj: widget instance
*/
Studio.registerAction(
	thisObj,
	'confirmLocationWidgetCbk',
	'confirmLocationWidgetCbk',
	[],
	$.proxy(thisObj.confirmLocationWidgetCbk, thisObj),
	[],
  );
  Studio.registerAction(thisObj, 'getInputValue', 'getInputValue', [], $.proxy(thisObj.getInputValue, thisObj), []);
  Studio.registerAction(
	thisObj,
	'setInputWidgetValue',
	'setInputWidgetValue',
	[],
	$.proxy(thisObj.setInputWidgetValue, thisObj),
	[],
  );
  Studio.registerAction(
	thisObj,
	'setWidgetProperties',
	'setWidgetProperties',
	[],
	$.proxy(thisObj.setWidgetProperties, thisObj),
	[],
  );
  Studio.registerAction(
	thisObj,
	'setInput',
	'setInput',
	[{ name: 'customizeVal', type: 'text' }],
	$.proxy(thisObj.setInput, thisObj),
	[],
  );

/**
* Example of the response action function for data update
* In the global_SelectWidget.js file, this function is defined at the same level as the render function.
*/
confirmLocationWidgetCbk: function (param) {
    if (param && param.eventParam && this.vm) {
      this.vm.getDataEntry(param.eventParam);
    }
  },
// Obtain the value of the current text box.
getInputValue: function () {
if (this.vm && this.vm.selectConfObj) {
  return this.vm.selectConfObj.selectValue;
   }
},
// Set the bidirectional binding value of the widget.
setInputWidgetValue: function (value) {
  this.vm.selectConfObj.selectValue = value;
    if (this.editVm?.selectConfObj) {
    this.editVm.selectConfObj.selectValue = value;
 }
this.advanceEditvm?.save();
},
// Update the widget configuration.
setWidgetProperties: function (selectConfObj) {
magno.savePropertiesForWidget({
  selectConfObj: JSON.stringify(selectConfObj),
  });
},
setInput: function (value) {
  this.vm.selectConfObj.selectValue = value.customizeVal;
  if (this.editVm?.selectConfObj) {
    this.editVm.selectConfObj.selectValue = value.customizeVal;
  }
  this.advanceEditvm?.save();
},