Using UI page in Workspace with UI Action

Stefan Petkovic · ‎10-26-2023

Hey guys, I need help with figuring this out so I have a UI action which code opens a UI Page in a Modal window.

function modalPopUp() {
    var gm = new GlideModal("x_adab_quality_populate_via_template", false, 600);
    gm.setTitle("Choose a Template");
	gm.render();
}

It's pretty basic, now down bellow I did enable for this button to show in the Workspace when a Workspace Client Script presented itself, how can I use my UI page in anyway when this UI Action button is clicked from the Workspace?
Probably it's not an easy straightforward approach, please help 🙂

Ankur Bawiskar · ‎10-26-2023

@Stefan Petkovic

you need a workspace client script written in UI action

Did you write it?

there is a syntax to open UI page

this is the syntax

var ui_page_id = '<sys_id_of_your_ui_page>';
    g_modal.showFrame({
        url: '/ui_page.do?sys_id=' + ui_page_id,
        title: 'Choose a template',
        size: 'xl',
        height: 500
    });

reference: UI page on Agent workspace

If my response helped please mark it correct and close the thread so that it benefits future readers.

Regards,
Ankur
✨ Certified Technical Architect || ✨ 9x ServiceNow MVP || ✨ ServiceNow Community Leader

View solution in original post

Stefan Petkovic · ‎10-27-2023

My UI action no click looks like this:

function modalPopUp() {
    var gm = new GlideModal("x_adab_quality_populate_via_template", false, 600);
    gm.setTitle("Choose a Template");
    gm.render();

}

UI action Workspace Client Script:

function onClick(g_form) {
	var ui_page_id = 'someid';
    g_modal.showFrame({
        url: '/ui_page.do?sys_id=' + ui_page_id,
        title: 'Choose a template',
        size: 's',
        height: 100
    });
}

UI page HTML:

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
	<label>Templates</label>
    <g:ui_reference name="actionSetTemplates" id="actionSetTemplates" 
	table="x_adab_quality_action_set"
	query="active=true"
	mandatory="true"
	/>

    <footer class="modal-footer flex">
        <g:dialog_buttons_ok_cancel ok="return grabTheTemplate();" cancel="return onCancel();" ok_type="button" cancel_type="button"/>
    </footer>
	
</j:jelly>

I don't think we can make this work ?

Stefan Petkovic · ‎10-27-2023

Looks like this btw:

Samaksh Wani · ‎10-27-2023

Hello @Stefan Petkovic

https://beautifier.io/

This is online javascript beautifier, you can paste your code and beautify it.

Plz mark my solution as Accept, If you find it helpful.

Regards,

Samaksh