JavaScript client events

Advanced users can add JavaScript-based client events to automate certain processes. For example, you can add dependencies between fields on records so that a field value is automatically calculated or automatically retrieved from a related grid when another field(s) is filled in or when a certain condition is met.

JavaScript events can be added to grid and detail pages.

Examples of how JavaScript-based events can be implemented on your portal:

  • Value of the field A is taken from the related grid after the field B is filled in
  • Value of the field C is calculated automatically using values from the field A and field B
  • Value of the field A is calculated automatically on condition that value of the field B meets a specific criterion (e.g. becomes more than 100).

JavaScipt client events can be created directly on the portal or uploaded to the portal with predefined JavaScript code and settings.

To create a new JavaScript client event

  1. In CMS, go to Media > Portal Settings > Events.
  2. Select the  icon next to Events, and then select Event icon Event.
  3. On the header, type the name of the event that will be used to identify it in CMS.
  4. In the Entity field, select a portal entity for which this event will be applicable.

      Note

    You will be able to add this event to a grid or detail (card) page the data source of which uses the portal entity that you specify here. 
  5. In the Event field, type the title of the event that will be displayed in the drop-down list when you are adding an event to a grid or detail page.
  6. In the Event content field, specify the JavaScript code that will be run in this event.
  7. If the JavaScript code in the event entity(ies) uses a different entity, other than the entity specified in the Entity field, specify the related entity(ies) as well as related pages under Related entity. You can add several entities if the code references more than one related entity. Select the  icon to add a related entity and fill in the fields as follows:
    • Entity name – Specifies the name of the related entity, which is used in the event code. 
    • Event entity – Specifies the title of the related entity. Select a related entity from the list of available portal entities.
    • Related entity page – Specifies the page of the related entity. Select Add, and then select the corresponding portal page.
  8. Select Save to save the created event.

Now the created event can be added to portal and grid pages that use the event's entity as data source.

To upload JavaScript client event(s)

  1. In CMS, go to Media > Portal Settings > Events.
  2. Select the Upload/Download tab.
  3. Next to Upload events metadata file, select Choose file, browse to a file with the metadata (structure) of the client events, and then click Open.

      Note

    The metadata of existing client events will not be overwritten.
  4. Next to Upload events file, select Choose file, browse to a structured JavaScript file with code (functions, methods, etc.) for the client events that can be used to automate various processes on the Front-End, and then click Open.

      Note

    Existing client events will not be overwritten.
  5. Select Save.
  6. To ensure that the metadata of uploaded events has been verified successfully, go to the Metdata validation tab and view the values in the following fields:
    1. Last uploaded events metadata title – Specifies the title of the last uploaded events metadata file.
    2. Last uploaded events metadata description – Specifies the description of the last uploaded events metadata file.
    3. Last uploaded events metadata validation – Specifies issues that were detected during the last validation of the last uploaded events metadata file.

To download JavaScript client event(s)

  1. In CMS, go to Media > Portal Settings > Events.
  2. Select the Upload/Download tab.
  3. Next to Download events metadata file, select Download, and then, on the browser page with opened metadata file, select and hold (or right-click) > Save As to save the JSON file with the metadata (structure) of the client events.
  4. Next to Dowload events file, select Download to save the ZIP file with all existing portal client events.
     

To add an event to a grid page

  1. Open the settings for the grid page where you want to add an event.
  2. On the Permissions tab, for the required member group, select the  icon next to Events.
  3. In the Title field, type the title of the event.
  4. In the Event field, select an event that will be automatically run for this member group. What exactly will happen in the selected event and under which conditions depends on the event code.

      Note

    Only events created for the portal entity specified on the Data source tab of the grid page will be available for selection.
  5. Set the Enabled switch to ON. You can use this switch to temporarily disable the event without deleting the setting.
  6. Add more events for this member group if necessary .
  7. Add more events for other member groups if necessary.

To add an event to detail page

  1. Open the settings for the detail page where you want to add an event.
  2. On the Permissions tab, for the required member group, select the  icon next to Events.
  3. In the Title field, type the title of the event.
  4. In the Event field, select an event that will be automatically run for this member group. What exactly will happen in the selected event and under which conditions depends on the event code.

      Note

    Only events created for the portal entity specified on the Data source tab of the detail page will be available for selection. 
  5. Set the Enabled switch to ON. You can use this switch to temporarily disable the event without deleting the setting.
  6. Add more events for this member group if necessary .
  7. Add more events for other member groups if necessary.