Hi Team,
As a part of requirement, I need to have a UI Action at related list level that shows a pop-up with 2 fields.
1)User Field
2)Comments Field
And a submit and cancel button below those fields. submitting this pop-up will create a new approval record and attach it to the corresponding record on which this related list tab is there.
I am able to achieve it in the native UI, but have trouble delivering the same at workspace level.
I have created a declarative UI Action, and I can see it on the related list of the Approvals.
But that declarative action is not function even after using OOB mapping events and action payload definition. Here are the configurations for the declarative action, please check and let me know where am I going wrong.
1)Declarative Action
2)Action Payload
3) Mapped Event
Target Payload:
{
"container": {
"fields": {
"binding": {
"address": [
"fields"
]
},
"type": "EVENT_PAYLOAD_BINDING"
},
"params": {
"binding": {
"address": [
"params"
]
},
"type": "EVENT_PAYLOAD_BINDING"
},
"route": {
"binding": {
"address": [
"route"
]
},
"type": "EVENT_PAYLOAD_BINDING"
},
"size": {
"binding": {
"address": [
"size"
]
},
"type": "EVENT_PAYLOAD_BINDING"
}
},
"type": "MAP_CONTAINER"
}
4) UX Target Event
I have created a new page with the two fields and the buttons, and calling that page in the Action Payload Definition as route.
Let me know if any further details are required to resolve this issue.
To display a popup when the Declarative Action in the related list is clicked (show the page in a popup window)
Step - 1: Create a Modal
Click on the + icon and select the “Custom” model. And in the body of the custom modal add any component Example: Textarea
Step 2: Create an event handler in the page body and trigger the "Open or Close Dialog Window" action, which corresponds to the "Custom 1" model.
→ To create a custom event handler, navigate to the Page Body. Then, on the right side of the screen, go to the Events tab as shown in the below picture.
On the Events tab, scroll down to the bottom to find the Handled Events section. In that section, click ADD. A popup will appear where you need to fill in fields such as Event Label and Template.
→ When you enter the Event Label, the Event Name will be auto-populated. Then, in the Payload Fields section, click the Add button and enter a payload name. Once it is done click on the “Add” button on the bottom of that popup.
Step 3: Add an event mapping to open the modal whenever the event is triggered which we have created in Step 2 is triggered.
As highlighted in the above picture click on the “Add event mapping” button and attach the event we have created in step - 2 to open a model as shown in the below picture.
→ In the below picture “OpenModel” is nothing but the event handler we have created in the step - 2. So select the event you have created and click on the continue button.
Once you click on the continue button you will have another pop up where you have to select the “Open or close modal dialog” and click on continue button.
Once you click on the continue button you will have another pop up where you have to select the model we have created in step -1 and click on add button.
Step - 4: Create a record in “sys_declarative_action_assignment” table.
Set the Implemented as field to “UXF client action” and set the table to the table where you need the button to be displayed. And we have to create a new record in the “sys_declarative_action_payload_definition” table and tag it to the “Specific client action”
Step -5: Create Specific client action in “sys_declarative_action_payload_definition” table.
In the “Payload” field the value i gave is nothing but the payload field we have created previously, i have attached the picture below for your reference.
Now we have successfully created a record in “sys_declarative_action_assignment” table.
Step - 6: Create a record in the “sys_ux_addon_event_mapping” table.
On the “sys_declarative_action_assignment” record we have created in the above step scroll down to the related list and under the “UX Add-on Event Mappings” related list we have to create a record.
For “Source element ID” field navigate to the UI builder and click on the related list and copy the id of the related list and paste it in the “Source element ID” field.
For the “Parent Macroponent” field on the top of the page you will see the “settings” button, which is highlighted in the below screenshot. Click on that and copy the name and set the value of “Parent Macroponent” field.
And finally for the “Target Event” field select the record which we have created in the step -2 and step -3.
And in the “Target Payload Mapping” field copy the payload given below.
{
"container": {
"OpenModelWindow": { // Where ever you see OpenModelWindow is nothing but
"binding": {
"address": [
"OpenModelWindow"
]
},
"type": "EVENT_PAYLOAD_BINDING"
}
},
"type": "MAP_CONTAINER"
}
Once all the above steps are done navigate to the Workspace and open any incident related list, here in my case i am testing with the “Child incident related list”
Output :
Regards,
Charan
