How to use g_modal from an UI Action for Agent Workspace?

[americo]

Hello community,

I'm trying to open a custom component in a Modal window in Agent workspace through a UI Action, you can actually do that as per the docs to use a custom component and call g_modal in a UI aciton to render your component. I have followed the steps in the docs as per below link, just you may need to add admin role to the ACLs in the table sys_aw_registered_scripting_modal 😉

https://docs.servicenow.com/bundle/orlando-servicenow-platform/page/administer/workspace/task/set-up...

However, I would like to control the buttons in the modal window or pass along some data back from the custom component to the modal window or being able to control the modal from my custom component.

Basically , In my custom component I want to list some categories and base on what is selected to pass back those values to the form, I can pass the g_form object as part of the params values when invoking the g_modal. However, I would like to return or pass this data selected in the child component to the modal component so once the user clicks the button I can validate this in the UI action rather from the child component,  I want to avoid using g_form in my custom component and instead to pass values to it. Another approach I was thinking of is to hide the modal buttons and instead use the buttons from my custom component and be able to close the modal popup from the custom component. Sadly I'm not able to find how to disabled buttons in the modal or pass some reference to my custom component to close the modal. Seems that g_modal has not much information about what options can be configured or pass to it.

Something to mention is that I can pass some parameters to my custom component by specifying those in the params object, think of params as your properties object 🙂 , as per below example:

g_modal.global.showTemplate({
title: 'Response Template',
//confirmTitle:'Copy',
params: {
secondaryItems:{},
table: g_form.getTableName(),
sysId: g_form.getUniqueValue(),
gForm: g_form
}
}).then(function(result){
console.log(result)
alert('confirm:'+result);
}, function(error) {
console.log(error)
alert('cancel:'+error);
});

[Amitoj Wadhera]

You can try the below code:- Here the table is cmdb_ci_web_server

function onClick(g_form) {
   
    var fields = [{
            type: 'textarea', // datatype
            name: 'short_description', // back-end field name
            label: getMessage('Update Short Description'),
            value: '', // should be blank (for user inputs)
            mandatory: true
        },
        {
            type: 'reference',
            name: 'support_group', //Give your custom reference field
            label: getMessage('What is prefered Support Group?'), //Give as per your requirement
            mandatory: true,
            reference: 'sys_user_group', //Give which table your custom field refers to
            referringTable: 'cmdb_ci_web_server', //Give your custom table
            referringRecordId: g_form.getUniqueValue()
        },
        {
            type: 'choice',
            name: 'due_in',
            label: getMessage('Due in'),
            value: getMessage('--None--'),
            choices: [{
                    displayValue: '1 Day',
                    value: '1 Day'
                },
                {
                    displayValue: '1 Hour',
                    value: '1 Hour'
                },
                {
                    displayValue: '1 Week',
                    value: '1 Week'
                }
            ],
            mandatory: true
        },

    ];

    g_modal.showFields({
        title: "Updating Server Short Description",
        fields: fields,
        size: 'lg',
        cancelTitle: getMessage('Cancel the Operation'), // changing the label of cancel button
        confirmTitle: getMessage('Confirm'),  // changing the label of Ok button
        cancelType: 'default',
        confirmType: 'confirm'
    }).then(function(fieldValues) {
        g_form.setValue('short_description', fieldValues.updatedFields[0].value);
        g_form.setValue('support_group', fieldValues.updatedFields[1].value);
        g_form.setValue('due_in', fieldValues.updatedFields[2].value);
        g_form.save();

    });
}

Kind Regards,

Amitoj Wadhera

Please Mark Helpful if that is what you needed.