UI Page Pop Up called from UI Action in Cab Meeting Related List

[iva25]

There is one Requirement I am trying to build.

There is one button named as "Send meeting request to attendees copy" - this is a UI Action.

When you click on "Send meeting request to attendees copy" one pop up will be shown up that is a UI page named as "attendee_notifications_popup"

Requirement:
The Popup Should showcase the names of the attendees present the cab meeting Attendees related list.
- The user can be added to the attendee list from the glide list

- The user can be removed from the attendee list

- The glide list should be auto filled with the existing attendee

- The popup should show the email body which is going to be sent to the attendee

What I have done
- I am to get the list of the existing attendees

- I am able to get the sys ids of the existing attendees

Challenges I am facing
- How to pass the sys ids of the cab meeting from the UI action to the UI page or How I can get the sys ids of the cab meeting so that I can filter out dynamically the attendees for each meeting

- The glide list is not showing the existing attendees for which I am able to get the sys ids

UI Page Code:
HTML:

<?xml version="1.0" encoding="utf-8"?>
<j:jelly trim="true" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">

    <g:evaluate>
        var cbgr = new GlideRecord('cab_attendee'); // Querying the 'cab_attendee' table
        cbgr.addEncodedQuery("cab_meeting=ddb4a4ef5ca712104f3496f8659cf639"); // Hardcoded for testing
        cbgr.query();

        // Create an array to hold attendee names
        var attendees = [];
        while(cbgr.next()){
        attendees.push(cbgr.attendee.getDisplayValue()); // Push attendee display names to array
        gs.info("Avi: Attendees List: " + cbgr.attendee.getDisplayValue());
        }

        // Convert the attendees array to a comma-separated string to pass to Jelly
        var attendeesString = attendees.join(',');

        // Pass the attendees string to the Jelly template
        attendeesString;
    </g:evaluate>

    <g:evaluate>
        var cbgr = new GlideRecord('cab_attendee'); // Querying the 'cab_attendee' table
        cbgr.addEncodedQuery("cab_meeting=ddb4a4ef5ca712104f3496f8659cf639"); // Hardcoded for testing
        cbgr.query();

        // Create an array to hold attendee names
        var attendeesid = [];
        while(cbgr.next()){
        attendeesid.push(cbgr.attendee); // Push attendee sys id to array
        gs.info("Avi: Attendees List: " + cbgr.attendee.getDisplayValue());
        }

        // Convert the attendees array to a comma-separated string to pass to Jelly
        var attendeesSysIds = attendeesid.join(',');

        // Pass the attendees string to the Jelly template
        attendeesSysIds;
    </g:evaluate>

    <!-- Use sys_ids to prefill list collector -->
    <g:macro_invoke macro="lightweight_glide_list" id="change_subsystem" name="change_subsystem" control_name="myListCollector" reference="sys_user" can_write="true" value="${attendeesSysIds}" />
    <p>Initial attendees: ${attendeesSysIds}</p>

    <!-- Displaying Attendees as List -->
    <table style="margin:20px 10px;">
        <tr>
            <td colspan="2"><strong>List of Attendees</strong></td>
        </tr>
        <tr>
            <td colspan="2">
                <ul>
                    <!-- Loop through the comma-separated list and display each one as a list item -->
                    <j:forEach var="jvar_attendee" items="${attendeesString.split(',')}">
                        <li>${jvar_attendee}</li> <!-- Display attendee names as list items -->
                    </j:forEach>
                </ul>
            </td>
        </tr>
    </table>

    <!-- Additional Content -->
    <table width="100%">
        <tr>
            <td />
            <td />
        </tr>
        <tr>
            <td>${gs.getMessage('Do you want to send the notification only to the new attendees or to all attendees?')}</td>
        </tr>
        <tr>
            <td colspan="2" align="right">
                <br />
                <g:dialog_buttons_ok_cancel ok="return sendToNew();" cancel="return sendToAll();" ok_type="button" cancel_type="button" ok_text="${gs.getMessage('Send to new')}" cancel_text="${gs.getMessage('Send to all')}" />
            </td>
        </tr>
    </table>
</j:jelly>

Client Script:

function sendToNew() {
	var gdw = GlideDialogWindow.get();
	var f = gdw.getPreference('sendToNew');
	if (typeof(f) == 'function') {
		f();
		return;
	}
}

function sendToAll() {
	var gdw = GlideDialogWindow.get();
	var f = gdw.getPreference('sendToAll');
	if (typeof(f) == 'function') {
		f();
		return;
	}
}

Processing Script:
-Empty I am not using any processing script

Please provide the approach or the solution or any link that can help me building this solution ASAP. This is on priority and as of now I am stuck I am trying hard but missing something as I didn't have worked much on the jelly scripting.

TIA

[Ankur Bawiskar · Accepted solution]

@iva25 

you can pass sysId from UI action to UI page using this syntax and grab it and then use it further to set in glidelist macro

UI Action: How to send

dialog.setPreference('sysid', '<Your SysId>');

UI Page:

<g:evaluate var="jvar_sysid" expression="RP.getWindowProperties().sysid"/> 

<g:evaluate jelly="true" object="true" var="jvar_attendeearray">
		var sysId = jelly.jvar_sysId;
// now use this to query and hold the user sysIds in array and use in macro
		
	</g:evaluate>

<g:macro_invoke macro="lightweight_glide_list" id="change_subsystem" name="change_subsystem" control_name="myListCollector" reference="sys_user" can_write="true" control_name="QUERY:active=true^sys_idIN${jvar_attendeearray}" />		

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

[Siddhesh Jadhav]

Hello @iva2525,

This is the solution for your question regarding showing a dynamic popup for sending meeting requests in ServiceNow:

Solution Steps:

---

1. Update Your UI Action

Use the following code in your UI Action to dynamically pass the CAB Meeting sys_id:

var dialog = new GlideDialogWindow('attendee_notifications_popup');
dialog.setTitle('Send Meeting Request');
dialog.setPreference('cab_meeting_sys_id', current.sys_id);
dialog.render();

---

2. Update Your UI Page to Read the sys_id

In your Jelly code:

<g:evaluate var="cabMeetingId" expression="jvar_cab_meeting_sys_id" />
<g:evaluate>
    var attendees = [];
    var attendeesid = [];

    var cbgr = new GlideRecord('cab_attendee');
    cbgr.addQuery('cab_meeting', cabMeetingId);
    cbgr.query();

    while(cbgr.next()){
        attendees.push(cbgr.attendee.getDisplayValue());
        attendeesid.push(cbgr.attendee.toString());
    }

    var attendeesString = attendees.join(',');
    var attendeesSysIds = attendeesid.join(',');
</g:evaluate>

---

3. Prefill Glide List and Show Attendee Names

<g:macro_invoke 
  macro="lightweight_glide_list" 
  name="attendee_list" 
  reference="sys_user" 
  can_write="true" 
  value="${attendeesSysIds}" />

<ul>
  <j:forEach var="jvar_attendee" items="${attendeesString.split(',')}">
    <li>${jvar_attendee}</li>
  </j:forEach>
</ul>

---

4. Show Email Body

<p><strong>Email Content:</strong></p>
<textarea readonly rows="5" cols="100">
Dear Attendee,

This is a reminder for the CAB meeting scheduled for [Date/Time].

Regards,
CAB Team
</textarea>

---

Final Notes:

• Avoid hardcoding sys_id values—always pass them dynamically

• You can make this more modular with a Processing Script if needed

• This approach makes your popup dynamic for all CAB meetings

---

Thanks and regards,
Siddhesh Jadhav
Please mark my answer helpful and accepted if it solved your problem 

Let me know if you need help wiring the Processing Script or further enhancements!

[iva25]

Have you tested your solution?
I placed your suggestion in my code snippet and it's not working.
Find the list of errors it's showing in the log:

Another thing the UI action is client callable so current.sys_id will not work so I used this:

var sysId = g_form.getUniqueValue();
	dialog.setPreference('cab_meeting_sys_id', sysId);
    dialog.setPreference('sendToNew',  sendNotificationsToNewAttendees.bind(this, dialog));
    dialog.setPreference('sendToAll',  sendNotificationsToAll.bind(this, dialog));
	dialog.render();

This gives the sys_id I checked in the alert. 

The main problem is linking the UI action variable to the jelly. I already tried by using the setPreference and access that in the Jelly It didn't work. Another thing is that do you think g:evaluate can give two variables as a output?

<g:evaluate var="cabMeetingId" expression="jvar_cab_meeting_sys_id" />

    <g:evaluate>
        var attendees = [];
        var attendeesid = [];

        var cbgr = new GlideRecord('cab_attendee');
        cbgr.addQuery('cab_meeting', cabMeetingId);
        cbgr.query();

        while(cbgr.next()){
        attendees.push(cbgr.attendee.getDisplayValue());
        attendeesid.push(cbgr.attendee.toString());
        }

        var attendeesString = attendees.join(',');
        var attendeesSysIds = attendeesid.join(',');
    </g:evaluate>
    <!-- Use sys_ids to prefill list collector -->
    <g:macro_invoke macro="lightweight_glide_list" name="attendee_list" reference="sys_user" can_write="true" value="${attendeesSysIds}" />

    <!-- Displaying Attendees as List -->
    <table style="margin:20px 10px;">
        <tr>
            <td colspan="2"><strong>List of Attendees</strong></td>
        </tr>
        <tr>
            <td colspan="2">
                <ul>
                    <!-- Loop through the comma-separated list and display each one as a list item -->
                    <j:forEach var="jvar_attendee" items="${attendeesString.split(',')}">
                        <li>${jvar_attendee}</li>
                    </j:forEach>
                </ul>
            </td>
        </tr>
    </table>

Output after updating the suggested code:

Do you have any idea How to define the process script and from there how to use the variables that holds the output in the jelly script.

Thank You for your time and effort and providing the suggestions.

[Siddhesh Jadhav]

Hi @iva25 ,

I hope this solution will work for you

Instead of hardcoding the CAB Meeting ID in your Jelly script, replace this line:

cbgr.addEncodedQuery("cab_meeting=ddb4a4ef5ca712104f3496f8659cf639");

With this at the top of your Jelly page:

<g:evaluate var="jvar_cabMeetingId">
  RP.getWindowProperties().get('cab_meeting_sys_id');
</g:evaluate>

Then use:

cbgr.addQuery("cab_meeting", jvar_cabMeetingId);

This will make your page dynamically use the CAB Meeting ID passed from the UI Action.

Thanks and regards,
Siddhesh Jadhav

Please mark my answer helpful and accepted if it solved your problem.

[Siddhesh Jadhav · Accepted solution]

Hi @iva25 ,

Here’s a working example I used on the Incident table to pass the assignment_group sys_id to a UI Page and display the group name using Jelly.

---

UI Action Script:

function openAssignmentGroupDialog() {
  var groupId = g_form.getValue('assignment_group');
  alert(groupId); // just to verify

  var dialog = new GlideDialogWindow('attendee_notifications_popup');
  dialog.setTitle('Assignment Group Info');

  dialog.setPreference('assignment_group_sys_id', groupId);
  dialog.render();
}

 

 UI Page Jelly Code:

<?xml version="1.0" encoding="utf-8"?>
<j:jelly trim="true" xmlns:j="jelly:core" xmlns:g="glide">

  <!-- Get sys_id from dialog preference -->
  <g:evaluate var="jvar_groupId">
    RP.getWindowProperties().get('assignment_group_sys_id');
  </g:evaluate>

  <!-- Get group name using sys_id -->
  <g:evaluate var="jvar_groupName">
    var name = '';
    var gr = new GlideRecord('sys_user_group');
    if (gr.get('${jvar_groupId}')) {
      name = gr.getValue('name');
    }
    name;
  </g:evaluate>

  <p><strong>Assignment Group Name:</strong> ${jvar_groupName}</p>
  <p><strong>Assignment Group sysId:</strong> ${jvar_groupId}</p>

</j:jelly>

This approach works perfectly for showing reference values in a UI Page passed via GlideDialogWindow.

Let me know if you need help expanding this!

Thanks and regards,
Siddhesh Jadhav

Please mark my answer helpful and accepted if it solved your problem.