SimpleWidget(s)

The SimpleWidget and SimpleWidgets client-side classes provide the methods for widget structure and functionality customization:

• Use the s_widget object of the SimpleWidget class to implement the required functionality. The object becomes available when a widget you create is initialized.

• Use the s_widgets object of the SimpleWidgets class to implement the required functionality. The object is initialized when you add a widget to a form or a portal page.

To create your own widget methods, use the s_widget_custom.

note

These methods can only be used on the client-side.

SimpleWidget

s_widget

---

Use the s_widget object to perform the current widget customization with the methods below.

note

To manually invoke the method, pass the widget instance ID as the first parameter in the console. For example, to call the following method:

s_widget.getFieldValue(key);

use the following approach:

s_widget.getFieldValue(widgetId, key);

s_widget.addTemplate(id, template, script, type)

---

Use this method to add a child template to the existing template by its id with one of the following types: inner, before, after.

Parameter(s):

Name	Type	Mandatory	Description	Default value	Example
id	String	Y	Specify the div tag id.	N	steps
template	String	Y	Specify the template body.	N	<div class="main">
script	String	N This parameter is mandatory if you need to define the type parameter. If no script is needed, use an empty string ('') as in the example below.	Add the script of the template. It is only ran once, after the template is added.	N	s_widget.addTemplate("cards", s_widget.getFieldValue("template"), "console.log('Hello world!');", "inner");
type	String	N	Specify the template type. It defines, where the template is added. Available options: inner before after	inner	before

Return:

Type	Description
Void	This method does not return a value.

Example:

Template

<div id="steps"></div>

Client script

s_widget.addTemplate('steps', '<div class="main">', '', 'inner');

s_widget.getElements()

---

Use this method to return the widget structure elements collected in an array. The elements in the response are ordered the same way as on the page.

Return:

Type	Description
Array of HTML elements	This method returns an array of the widget structure elements.

Example:

s_widget.getElements()

s_widget.getElements();

s_widget.getFieldValue(key)

---

Use this method to return the data value of the widget that is defined by the key option.

Parameter(s):

Name	Type	Mandatory	Description	Default value	Example
key	String	Y	Specify the field key that can be used to receive the value of the field.	N	element

Return:

Type	Description
Any	This method returns the value of the field that is defined by the key.

Example:

s_widget.getFieldValue()

s_widget.getFieldValue('element');

s_widget.getId()

---

Use this method to return a widget instance ID.

Return:

Type	Description
String	This method returns a widget instance ID.

Example:

s_widget.getId()

s_widget.getId();

s_widget.getOptionValue(key)

---

Use this method to return the value of an option defined by the key from the widget Schema option values.

Parameter(s):

Name	Type	Mandatory	Default value
key	String	Y	Specify the key of the option from the widget Schema option values.

Return:

Type	Description
Any	This method returns a value of the widget option that is defined by the key.

Example:

s_widget.getOptionValue

s_widget.getOptionValue('label');

s_widget.removeTemplate(id)

---

Use the method to remove all child nodes and content from the specified element. It does not remove the element itself or its attributes.

Parameter(s):

Name	Type	Mandatory	Description	Default value	Example
id	String	Y	Specify the id of the div tag.	N	element1

Return:

Type	Description
Void	This method does not return a value.

Example:

Template

<div id="element1">
  Remove
</div>
<button buttonType="approve" event-click="window.s_widget_custom.remove();">
  Add
</button>

CSS

#element1 {
  background-color: yellow;
  height: 20px;
}

Client script

;
(() => {
    window.s_widget_custom = window.s_widget_custom || {};
    window.s_widget_custom.remove = function () {
        s_widget.removeTemplate('element1');
    }
})();

s_widget.setFieldValue(key, value)

---

Use this method to set a value for the key.

note

If the value parameter is equal to null, for example, s_widget.setFieldValue ('subject', null), the defined field is cleared.

Parameter(s):

Name	Type	Mandatory	Description	Default value	Example
key	String	Y	Specify the key of the field whose value you need to change.	N	table_name
value	Any	Y	Specify a new value for the field.	N	tableName

Return:

Type	Description
Void	This method does not return a value.

Example:

s_widget.setFieldValue

;
(async () => {
    const tableName = s_form.getTableName();
    const recordId = s_form.getUniqueValue();
    const serviceId = s_form.getValue('service');
    const serviceDisplayValue = s_form.getDisplayValue('service');
 
    s_widget.setFieldValue('table_name', tableName);
    s_widget.setFieldValue('record_id', recordId);
    s_widget.setFieldValue('service', { database_value: serviceId, display_value: serviceDisplayValue });
    await s_widget.serverUpdate();
})();

s_widget.serverUpdate()

---

Use this method to transfer the data to a server, where the widget server script runs. As a result, the widget data is updated.

Return:

Type	Description
Object	This method returns a Promise object that contains a server response.

Example:

s_widget.serverUpdate()

;
(async () => {
    const tableName = s_form.getTableName();
    const recordId = s_form.getUniqueValue();
    s_widget.setFieldValue('table_name', tableName);
    s_widget.setFieldValue('record_id', recordId);
    const response = await s_widget.serverUpdate();
    console.log(response.getData().data);
})();

s_widget.setOptionValue(key, value)

---

Use this method to set a value using the key of the widget option.

Parameter(s):

Name	Type	Mandatory	Description	Default value	Example
key	String	Y	Specify the key of the widget option from Schema option values whose value you need to change.	N	label
value	Any	Y	Specify a new value for the option.	N	Name

Return:

Type	Description
Void	This method does not return a value.

Example:

s_widget.setOptionValue()

s_widget.setOptionValue('label', 'Name');

s_widget.showData()

---

Use the method to display the data of a widget in the console.

Return:

Type	Description
Object	The method returns an object with the widget parameters.

Example:

s_widget.showData()

s_widget.showData();

SimpleWidgets

s_widgets

---

Invoke the methods of the s_widgets object within your scripts, when adding a widget to a form or a page for widget interaction.

s_widgets.getFieldValue(widgetInstanceID, key)

---

Use this method to return the data value of the widget field for the key and widget instance ID.

Parameter(s):

Name	Type	Mandatory	Description	Default value	Example
widgetInstanceID	String	Y	Specify the ID of the widget instance.	N	169598365414458401
key	String	Y	Specify the key of the field whose value you need to get.	N	name

Return:

Type	Description
Any	This method returns the object value.

Example:

s_widgets.getFieldValue()

s_widgets.getFieldValue('157555401214600424', 'name');

s_widgets.getForm()

---

Use this method to return a form object that is placed using the <Form> or <remform> tag.

Parameter(s):

Name	Type	Mandatory	Default value
name	String	Y	N

Return:

Type	Description
Object	This method returns a SimpleForm object.

Example:

s_widgets.getForm()

const builtInForm = s_widgets.getForm('custom');
await builtInForm.save();

s_widgets.getWidgets()

---

Use this method to return a list of all the IDs of the widgets instances located on the page. The elements in the response are ordered the same way as on the page.

Return:

Type	Description
Array	This method returns a list of all the IDs of the widgets instances located on the page.

Example:

s_widgets.getWidgets()

s_widgets.getWidgets();

Response example

['160767740511016793', '160767742115787725', '160767742915897037', '160767743612372124', '158965632914393037', '158965975317960937', '161062077113210360']

s_widgets.setFieldValue(widgetInstanceID, key, value)

---

Use this method to set a value for the key in the widget data, and the widget instance ID.

Parameter(s):

Name	Type	Mandatory	Description	Default value	Example
widgetInstanceID	String	Y	Specify the ID of the widget instance.	N	169598365414458401
key String	Y	Specify the key of the field whose value you need to set.	N	name
value	Any	Y	Specify a new value for the field.	N	Alex

Return:

Type	Description
Void	This method does not return a value.

Example:

s_widgets.setFieldValue()

s_widgets.setFieldValue('157555401214600424', 'name', 'Alex');