SimpleForm
This class provides methods for forms configurations. These methods can only be used on the client side.
You can also use these methods to configure the dependencies between the fields and the values, for example, changing the values of the fields or clearing the fields.
-
On a page with a loaded form, you cannot access the form directly through the s_form variable in the browser console.
-
If on the page with a record form for one table there is an RE model for a record of another table, which is added to the form using a widget with the SimpleTag <rem>, or the model is displayed using the <remform> tag, the REM client script will not be able to access the form directly through the s_form variable. In this case, there are two independent form objects on the page.
-
Methods for working with REM attributes involve working with attributes displayed by the SimpleTag <rem> for the current table.
To operate the form in both cases described above, use the construction s_widgets.getForm('formName'), where formName is the name of the required form view.
SimpleForm(table, sys_id)
Use this constructor to instantiate a new SimpleForm object.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
table | String | Y | N |
sys_id | String | Y | N |
Return:
Type | Description |
---|---|
Object | This method returns a form object. |
Example:
window.s_widget_custom.submit = async function () {
await s_widget.serverUpdate();
const tableName = s_widget.getFieldValue('table_name');
const recordId = s_widget.getFieldValue('record_id');
const builtInForm = new SimpleForm(tableName, recordId);
await builtInForm.save().then(s_form.save());
s_modal.setShow(false);
s_go.reloadWindow();
}
modalForm()
Use this object of the SimpleForm class to interact with the modal window of the opened record from the client script of the form. The form is available by using the <Form> tag in the modal window widget.
Access the object using s_form.modalForm.
Return:
Type | Description |
---|---|
Object | This method returns a form object. |
Example:
s_form.modalForm.setValue('state', '2')
Global variable usage
Within any record form, you can use predefined global variables.
Variable | Description |
---|---|
currentFieldLabel | Defines a link to a Wrapper object for a field. The variable is used with the getColumnId() method. See the example: window.currentFieldLabel.getColumnId() One of the usage cases of this variable is the field context menu call. |
currentUiAction | Contains an object with an ID of the [UI action](/platform/developer-help/user-actions/UI actions) record. It is used when the context menu is called. |
s_form.addErrorMessage(message)
Use this method to display an error toast message in the lower right corner.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
message | String | Y | N |
Return:
Type | Description |
---|---|
Void | This method does not return a value. |
Example:
s_form.addErrorMessage('Please enter a valid email address using the following format: joe@example.com');
s_form.addInfoMessage(message, durationMilliseconds)
Use this method to display an informational toast message in the lower right corner. The message disappears after a certain period of time. In the durationMilliseconds parameter, specify this period in milliseconds.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
message | String | Y | N |
durationMilliseconds | Number | N | N |
Return:
Type | Description |
---|---|
Void | This method does not return a value. |
Example:
s_form.addInfoMessage('Link copied to clipboard', 2000);
s_form.addSuccessMessage(message, durationMilliseconds)
Use this method to display a message about a successul action in the lower right corner. The message disappears after a certain period of time. Specify this period in milliseconds in the durationMilliseconds parameter.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
message | String | Y | N |
durationMilliseconds | Number | N | N |
Return:
Type | Description |
---|---|
Void | This method does not return a value. |
Example:
s_form.addSuccessMessage('Record was successfully added!', 3000);
s_form.addWarningMessage(message, durationMilliseconds)
Use this method to display a warning message in the lower right corner. The message disappears after a certain period of time. Specify this period in milliseconds in the durationMilliseconds parameter.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
message | String | Y | N |
durationMilliseconds | Number | N | N |
Return:
Type | Description |
---|---|
Void | This method does not return a value. |
Example:
s_form.addWarningMessage('This record has been modified by another user', 3000);
s_form.addOption(fieldName, choiceValue)
Use this method to add a choice option to the end of the choice field. A user can add a choiceValue values defined for fieldName into the current set of the table options.
This method is asynchronous; for better performance, use the await keyword as shown in the code example below.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
fieldName | String | Y | N |
choiceValue | String | Y | N |
Return:
Type | Description |
---|---|
Object | This method returns a Promise object. |
Example:
const choices = ['10', '20', '30'];
s_form.clearOptions('contact_type');
for (const optionValue of choices) {
await s_form.addOption('contact_type', optionValue);
}
s_form.clearMessages()
Use this method to close all kinds of messages (both informational and error) in the form.
Return:
Type | Description |
---|---|
Void | This method does not return a value. |
Example:
s_i18n.getMessage('End date time cannot be less than start date time', (response) => {
s_form.clearMessages();
s_form.addErrorMessage(response);
});
s_form.clearOptions(fieldName)
Use this method to remove all options from the choice list.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
fieldName | String | Y | N |
Return:
Type | Description |
---|---|
Void | This method does not return a value. |
Example:
const choices = ['10', '20', '30'];
s_form.clearOptions('contact_type');
for (const optionValue of choices) {
await s_form.addOption('contact_type', optionValue);
}
s_form.clearValue(fieldName)
Use this method to clear out any field that is delete its value.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
fieldName | String | Y | N |
Return:
Type | Description |
---|---|
Boolean | This method returns false if it is unable to clear the value of the field in the following cases:
|
Example:
if (!s_form.getValue('sprint')) {
s_form.clearValue('points');
}
s_form.isFieldChanged(fieldName)
Use this method to verify whether the specified field has been changed.
If there is a client script changing the specified field is running on the form, this method returns true. Both a user and a script can initiate the changes.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
fieldName | String | Y | N |
Return:
Type | Description |
---|---|
Boolean | This method returns true if the specified field has been changed; otherwise, it returns false. |
Example:
if (s_form.isFieldChanged('state') && s_form.getValue('state') != 'new') {
return false; // abort form submit
}
s_form.formId
Use this class property to return the current form ID. The form view ID is an ID of the record in the UI Forms (sys_ui_form) table.
Return:
Type | Description |
---|---|
String | This method returns the record ID of the form view in the UI Forms (sys_ui_form) table. |
Example:
const url = new URL(`${API_BASE_URL}/export/excel`);
if (typeof s_form !== "undefined") {
url.searchParams.set('form_id', s_form.formId);
}
window.open(url, "_blank");
s_form.getAllFields()
Use this method to get a list of fields with their values placed on the form.
The return value contains two keys:
- the data key is an object, where the keys are the system field names, and the values are the values of those fields.
- the error key is an array with error messages if the form is saved in the current state.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
isAll | Boolean | N | false |
Return:
Type | Description |
---|---|
Object | When the isAll parameter is set to false, this method returns the info about the fields, where the values have been changed. When the value is set to true, the method returns the information about the fields on the form from all the sections, including the ones hidden by client scripts. On the new record form, the method returns a list of all form fields regardless of the isAll value. |
Example:
if (!s_form.getAllFields(true).data.hasOwnProperty('state')) return;
s_form.getChanges()
Use this method to retrieve information about the changed fields: field name, previous value, current value.
If there is a client script changing some fields is running on this form, the getChanges() method includes such fields in the array. Both a user and a script can initiate the changes.
Return:
Type | Description |
---|---|
Array of Objects | This method returns an array of objects with the fields changes. Each object contains a field name, its previous and current values. |
Example:
if (s_form.isChanged()) {
const changedFields = s_form.getChanges();
let payload = {};
changedFields.forEach((field) => {
payload[field.fieldName] = field.currentValue;
});
SimpleStorage.setItem('payload', payload);
}
s_form.getLabelOf(fieldName)
Use this method to return a label text value.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
fieldName | String | Y | N |
Return:
Type | Description |
---|---|
String | This method returns a string that contains a displayed field name. |
Example:
const FIELD_LABEL = s_form.getLabelOf('username');
s_form.addErrorMessage(`Field "${FIELD_LABEL}" contains invalid characters.`);
s_form.getREMDisplayValue(fieldName)
Use this method to get a displayable REM attribute value.
Find the values represented in the client scripts according to the field types in the table.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
fieldName | String | Y | N |
Return:
Type | Description |
---|---|
String | This method returns a value of the displayable attribute. |
Example:
s_form.addErrorMessage(`Service "${s_form.getREMDisplayValue('service')}" is not available`);
s_form.getREMLabelOf(fieldName)
Use this method to get a label text value of a REM attribute.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
fieldName | String | Y | N |
Return:
Type | Description |
---|---|
String | This method returns a string that contains an attribute label value. |
Example:
const FIELD_LABEL = s_form.getREMLabelOf('phone');
s_form.addErrorMessage(`Field "${FIELD_LABEL}" contains invalid characters.`);
s_form.getREMValue(fieldName)
Use this method to get a REM attribute value.
Find the values represented in the client scripts according to the field types in the table.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
fieldName | String | Y | N |
Return:
Type | Description |
---|---|
String | This method returns the database value of the specified field. |
Example:
if (s_form.getREMValue('model')) {
s_form.hideFieldMsg('model');
}
s_form.getSections()
Use this method to get an array of sections.
Return:
Type | Description |
---|---|
Array of HTML elements | This method returns an array that contains sections of a form. |
Example:
const sectionNames = s_form.getSections().map(section => section.name);
if (sectionNames.length) {
s_form.addInfoMessage(`You can move between ${sectionNames.join(', ')}` sections);
}
s_form.getSectionNames()
Use this method to return an array that contains the names of all sections, visible and hidden.
Return:
Type | Description |
---|---|
Array of String | This method returns an array that contains section names. |
Example:
const sectionNames = s_form.getSectionNames()
if (sectionNames.length) {
s_form.addInfoMessage(`You can move between ${sectionNames.join(', ')}` sections);
}
s_form.getTableName()
Use this method to return a table name that the specified record relates to.
The method returns the system table name, not the table title. Example:
- Table name – itsm_incident
- Table title – Incidents
Return:
Type | Description |
---|---|
String | This method returns the system table name. |
Example:
const TABLE_NAME = s_form.getTableName();
console.log(TABLE_NAME);
s_form.getUniqueValue()
Use this method to return a unique record ID.
Return:
Type | Description |
---|---|
String | This method returns the record ID; otherwise, it returns null. |
Example:
const TABLE_NAME = s_form.getTableName();
const RECORD_ID = s_form.getUniqueValue();
const currentRecord = new SimpleRecord(TABLE_NAME);
currentRecord.get(RECORD_ID, ()=> {
if (currentRecord.sys_id === RECORD_ID) {
s_form.addInfoMessage(currentRecord.sys_created_at);
}
});
s_form.getValue(fieldName)
Use this method to return the database value of the specified field.
Find the values represented in the client scripts according to the field types in the table.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
fieldName | String | Y | N |
Return:
Type | Description |
---|---|
String | This method returns the database value of the specified field. |
Example:
const callerId = s_form.getValue('caller_id');
if (!callerId) {
const callerRecord = new SimpleRecord('employee');
callerRecord.get(callerId, ()=> {
if (callerRecord.sys_id &&
callerRecord.personal_schedule) {
await s_form.setValue('schedule', callerRecord.personal_schedule);
} else {
s_form.addInfoMessage('Users schedule is not defined');
}
});
}
s_form.getDisplayValue(fieldName)
Use this method to return the displayed value of the field.
Find the values represented in the client scripts according to the field types in the table.
Parameter(s):
Name | Type | Mandatory | Default value |
---|---|---|---|
fieldName | String | Y | N |
Return:
Type | Description |
---|---|
String | This method returns the displayed value of the specified field. |
Example:
s_form.addInfoMessage(`Service "${s_form.getDisplayValue('service')}" is not available`);