Page History

User interface (UI) actions are buttons, links, and context menu items on forms and lists. They allow customizing you to customize the UI to be more interactive, adjustable, and comfortable for working.

UI action inheritance and override

In SimpleOne, you can inherit the UI actions can be inherited and then you can override their logic, scripts, order, name, or any other feature.

Inheritance rules

1. The following UI actions are applied to forms and lists:
   • UT UI actions inherited and not overridden by the Overrides by option on at the current inheritance level of inheritance.
   • The functionality overridden on at the current level of the UI actions inheritance.
   • UI actions specified on the current level.
2. UI action inherited on the 1^st level with functionality overriding specified on the 2^nd level cannot be applied on the 3^rd level of inheritance. An inherited UI action specified on the 2^nd level may be applied to the 3^rd one.
3. UI action inherited on the 1^st level with the functionality overriding specified on the 3^nd level cannot be overridden on the 2^nd level. In this case, the system warns of active override option and requires for its deactivation.

To inherit a UI action, complete the steps below:

1. Make Select the Inherits checkbox to make a UI action parent by setting the Inherits checkbox active and clicking the parent action, and click Save.
2. Make a UI action child by specifying Specify the Parent field with the UI  UI action you want, then customizing need and customize the record.
3. Click Save or Save and Exit to apply the changes.

To override a UI action, complete the steps below:

1. Open the child UI Action form.
2. In the Overrides by field, specify a parent UI Action that should be overridden.

UI

action types

1. On forms:
   • Header Left
   • Header Right
   • Hamburger Menu
   • Field Label Context Menu
   • Link
   • Bottom
2. On lists:
   • Header Left
   • Header Right
   • Hamburger Menu
   • Column Header Context Menu
   • Row Context Menu
   • Link
   • Bottom
3. Other:
   • Button Context Menu
   • Dependency Map Context Menu

UI actions on form

UI actions on list

Customize UI actions

You can create new or customize existing UI actions.

To do this, please complete the following steps:

1. Navigate to System Definitions → UI Actions.
2. Click New or select an existing UI-action.
3. Customize UI-action using the form provided.
4. Click Save or Save and Exit to apply the changes.

Tip
You can edit some types of UI actions like buttons, links in a quick way. For To do this, please complete the steps below: Right-click on the UI action you need to edit to open a context menu. Click Edit UI action. The specified UI action form appears. Image Modified

Global UI

actions

You can make a UI action display on all tables.

To do that, follow the steps below:

1. Open the UI action record desired.
2. On the form, specify Global table in the Table field.
3. Click Save or Save and Exit to apply changes.

Embed a UI

action

The UI action functionality allows creating multiyou to create multi-level submenu options by embedding items for to the hamburger menu within forms and lists. 

To embed a UI action, follow the steps below:

1. Create a parent UI action specifying , specify its type with the the Hamburger Menu checkboxes checkbox in the Form Style or List Style lanes on area in the Position and Style tab.
2. Click Save and Exit to leave the form.
3. Create a child UI action of the same type specifying its Parent option with UI action created before.
4. (Optionaloptional) Set Select the Inherits option active checkbox.
5. Click Save to apply the changes.

Display condition configuration

The condition optiondefines situations when UI actions displayed. The Condition field expects using server-side API, but in some cases, it is possible to apply client-side API. To enable client script use, on the UI action form, set select the Client option checked checkbox. Within In the Condition field, use the current object to access a UI action, use the current object. This object may be can only be used only for UI actions that are displayed on forms. 

Use logical operators && (AND) and ||  (OR) for making up to compose the complex conditional expressionsconditions.

Condition option allows invoking Conditions allow you to call the server-side side Script Includes created. In the example below, the function wfContextExists() of Script Include with the same name gets current.sys_id and current.getTableName as recordID and tableName arguments.

This UI action is a reference to the record with the sys_id of the getTableName table. If a record exists, the function returns TRUE true, and , in the opposite, it returns FALSE false when there is no record found. Depending on the value returned, the function displays the UI action or not.

function wfContextExists(recordID, tableName){
  const table = new SimpleRecord('sys_db_table');
  table.get('name', tableName);
  const wfContext = new SimpleRecord('wf_context');
  wfContext.addQuery('related_record_id', ss.getDocIdByIds(table.sys_id, recordID));
  wfContext.selectAttributes('sys_id');
  wfContext.query();
  return (wfContext.getRowCount() > 0)
}

ss.addInfoMessage(current.description);

await s_i18n.getMessage('The report has been saved', (response) => {
  s_form.addInfoMessage(response);
  __resolveServerResponse();
});

const table = s_list.getTablesName()[0];
const selectedRows = s_list.getCheckedRow(table);
if (!selectedRows.length) {
  await s_i18n.getMessage("No selected rows.", (translationResponse) => {
    alert(translationResponse);
  });
  __rejectServerResponse();
}

const rowRecordId = window.currentCell.recordId;
const rowTableName = window.currentCell.tableName;
if (rowRecordId) {
  s_go.open(`/record/${rowTableName}/${rowRecordId}`);
}

if (currents.length) {
  const record = new SimpleRecord(currents[0].getTableName());
  record.addQuery('sys_id', 'in', currents.map(checkedRow => checkedRow.sys_id));
  record.selectAttributes(['sys_id']);
  record.query();
  record.deleteMultiple();
  ss.setRedirect(); // reload window
} else {
  ss.addErrorMessage('No selected rows.');
}