You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 5 Next »

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

Role required: admin.


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 the form



UI actions on the list


Customize UI actions


You can create new or customize existing UI actions.

To do this, 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.


You can edit some types of UI actions like buttons, links in a quick way. To do this, complete the steps below:

  1. Right-click the UI action you need to edit to open a context menu.
  2. Click Edit UI action. The UI action form appears.

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 the changes.

Most hamburger menu items and some buttons on forms (New, Save, Save and Exit) and on lists (New, Delete) are global.

Embed a UI action


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

This option is only available for the UI actions of the Hamburger Menu type.

To embed a UI action, follow the steps below:

  1. Create a parent UI action, specify its type with the Hamburger Menu checkbox in the Form Style or List Style 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. (optional) Select the Inherits checkbox.
  5. Click Save to apply the changes.

Display condition configuration


The condition option defines 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, select the Client checkbox. In the Condition field, use the current object of the certain record to access a UI action. This object can only be used for UI actions that are displayed on forms. 

Call the current object within the UI actions during the update since this object is defined. When creating a new UI action, the current value is NULL.

Use logical operators && (AND) and || (OR) to compose the complex conditions.

Conditions allow you to call the server-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.


The ss object allows you to call the SimpleSystem methods.

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, and it returns false when there is no record found. Depending on the value returned, the function displays the UI action or not.

Example
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)
}

Define a UI action behavior with a script


The Script field defines the UI action behavior. By default, this field supports the Server-Side API. Select the Client checkbox to switch the available API to the Client-Side API.

For example, this UI action adds an informational message with the Description field content:

UI action
ss.addInfoMessage(current.description);

When the current object is called, it is not necessary to use the initialize() method; the object context is already initiated.

  • No labels