UI Builder Enhancement: Create New Button List with Popup

KrisShar · 2 hours ago

Opening a Dialog on Button Click in a List (UI Builder)

Configuration Steps

Create the following records via configuration:

1. Action Assignment

Table: sys_declarative_action_assignment

Create a new Action Assignment record.
Populate the fields as shown in the reference screenshot.

2. UX Add-on Event Mapping

Table: sys_ux_addon_event_mapping

List: CSM/FSM Workspace → List Sys ID

Payload: List Action Event Payload

Payload: List Action Event Payload:

{
    "container": {
        "external": {
            "binding": {
                "address": [
                    "external"
                ]
            },
            "type": "EVENT_PAYLOAD_BINDING"
        },
        "fields": {
            "binding": {
                "address": [
                    "fields"
                ]
            },
            "type": "EVENT_PAYLOAD_BINDING"
        },
        "multiInstField": "sysId",
        "params": {
            "binding": {
                "address": [
                    "params"
                ]
            },
            "type": "EVENT_PAYLOAD_BINDING"
        },
        "passiveNavigation": {
            "binding": {
                "address": [
                    "passiveNavigation"
                ]
            },
            "type": "EVENT_PAYLOAD_BINDING"
        },
        "redirect": {
            "binding": {
                "address": [
                    "redirect"
                ]
            },
            "type": "EVENT_PAYLOAD_BINDING"
        },
        "route": {
            "binding": {
                "address": [
                    "route"
                ]
            },
            "type": "EVENT_PAYLOAD_BINDING"
        },
        "size": {
            "type": "JSON_LITERAL",
            "value": "md"
        },
        "title": {
            "binding": {
                "address": [
                    "title"
                ]
            },
            "type": "EVENT_PAYLOAD_BINDING"
        }
    },
    "type": "MAP_CONTAINER"
}

3. Action Payload Definition

Table: sys_declarative_action_payload_definition

Configure the payload.
Route should reference the new page variant that opens inside the dialog.

4. UX App Route

Table: sys_ux_app_route

Parent Macrocomponent: CSM/FSM Workspace – List Sys ID

5. Action Configs

Table: sys_ux_action_config

Add the created Declarative Action under List Actions.

6. Page Variant Creation

Create a Page Variant at the CSM/FSM Workspace level.
Add a Form component to the page.
Configure Data Resources → Form Controller.

Result

A custom List Action button appears in the CSM/FSM Workspace list.
Clicking the button opens the configured page variant in a dialog with the form loaded.