How to open a modal in the workspace using a client script in an Action Assignment.

[CharanV98428402]

Hello Team,

I had a scenario where I needed to create a new button in the Approval-related list. In any workspace, the Approval-related list should display a "New Approval" button. When clicked, it should open a modal where I can enter the details, and upon clicking the OK button, an approval record should be created and attached to the current record I am working on.

For this use case, I followed the method described below. I would like to know if this approach is efficient or if there is an easier way to achieve the same outcome.

How to open a modal in the workspace using a client script in an Action Assignment.

In this post, we will explore an approach that does not require any changes to the Workspace. Instead, we will utilize the Related List Action (Client Script), which allows us to configure this button across all workspaces.

For this scenario, I am using the CSM and FSM Configurable Workspace Foundation.

Step -1: Create a record in “sys_declarative_action_assignment”.

1. Provide an appropriate name for the button that will appear in the related list under the Request table.

2. Set the Implemented as field to Client Script.

3. Select the appropriate table on which you want the button to be displayed. In my case, I want it to be displayed in the sysapproval_approver table.

4. In the client script field, implement the script below. Note: The script below is structured based on my use case. For your use case, you may need to make a few modifications.

Client script:

function onClick() {

    var url = top.location.href; //to get the URL of the page

    var match1 = url.match(/record\/([^/]+)\//);

    var tableName = match1 ? match1[1] : null;// fetching table name from URL

    var match2 = url.match(/record\/[^/]+\/([a-f0-9]{32})\b/);

    var activityId = match2 ? match2[1] : null;    // fetching sys_id from URL

    var fieldName = '';

    if (tableName == 'sc_request') {

        fieldName = 'requested_for';

    }

    if (tableName == 'sc_req_item') {

        fieldName = 'requestor';

    }

    var fields = [{

            type: 'reference',

            name: fieldName,

            label: getMessage('Select Approver'),

            // mandatory: true,

            reference: 'sys_user',

            referringTable: tableName,

            referringRecordId: activityId

        },

        {

            type: 'textarea',

            name: 'comments',

            label: getMessage('Comment'),

            mandatory: true

        }

    ];

    g_modal.showFields({

        title: "Add Approver",

        fields: fields,

        size: 'lg'

    }).then(function(fieldValues) {

        var ga = new GlideAjax("ManualApprovalProcessor");

        ga.addParam("sysparm_name", "createApproval");

        ga.addParam("sysparm_approver", fieldValues.updatedFields[0].value);

        ga.addParam("sysparm_comments", fieldValues.updatedFields[1].value);

        ga.addParam("sysparm_table", tableName);

        ga.addParam("sysparm_documentid", activityId);

        ga.getXMLAnswer(function(response) {

            if (response == "success") {

                g_form.addInfoMessage("Approval created successfully.");

                window.top.location.reload(); // reload to show new approval in list

            } else {

                alert("Error: " + response);

            }

        });

    });

}

I have also attached a detailed document below for your reference. If this method is helpful, please mark my response as correct and close the thread so that it may benefit future readers.

Regards,

Charan V

[Shruti D]

Hello @CharanV98428402 

Thanks for sharing such a practical example, it’s a great guide for anyone needing to implement modals in Workspace.

Please Mark Correct ✔️ if this solves your query and also mark Helpful 👍 if you find my response worthy based on the impact.

Regards,

Shruti

[KhyathiT]

Thanks for the detailed explanation Charan. This is really helpful🔥