Create a UX add-on event mapping

Connect a button to a modal using UX add-on event mapping in order for an action button to open a custom modal.

Before you begin

Complete the following actions:

• Create a form action
• Open your record page in UIB or create a page variant in UIB
• Design your page variant in UIB
• Configure your page variant as a modal in UIB

Role required: admin

Procedure

1. Open the add-on event mapping <instance-name>.service-now.com/sys_ux_addon_event_mapping_list.do into your browser.

2. Create a new record by selecting New.

3. Enter a name for your map.

4. Select ui_action_bar for the Source element ID field.

5. Select the action name for your declarative action for the Source Declarative Action field.

6. Set the macroponent to the workspace record macroponent using the sysID copied from the record's page definition.

   For more information, see Configure a page variant as a modal in UIB.

7. Trigger the event to open a modal by selecting [Record Page] Open modal in the Target Event field.

8. Define the fields to send to the modal by pasting the JSON object into the Target Payload Mapping field.

   {
       "type": "MAP_CONTAINER",
       "container": {
           "route": {
               "type": "EVENT_PAYLOAD_BINDING",
               "binding": {
                   "address": ["route"]
               }
           },
           "size": {
               "type": "EVENT_PAYLOAD_BINDING",
               "binding": {
                   "address": ["size"]
               }
           },
           "fields": {
               "type": "EVENT_PAYLOAD_BINDING",
               "binding": {
                   "address": ["fields"]
               }
           },
           "params": {
               "type": "EVENT_PAYLOAD_BINDING",
               "binding": {
                   "address": ["params"]
               }
           }
       }
   }
   

9. Select Submit.