Please HELP ... need to show name-value pairs on UI Page ...

[Zod]

Please HELP. ChatCPT sucks ... not getting it.

I have this ajax function:

getRitmSummary: function() {
    try {
        var sysId = this.getParameter('sys_id');
        
        if (!sysId) {
            return new JSON().encode({
                status: 'error',
                message: 'No sys_id provided.'
            });
        }
        
        var ritmGR = new GlideRecord('sc_req_item');
        if (!ritmGR.get(sysId)) {
            return new JSON().encode({
                status: 'error',
                message: 'No RITM found with the provided sys_id.'
            });
        }
        
        // Prepare the response with label-value pairs
        var response = {
            status: 'success',
            data: {
                fields: [
                    {
                        label: ritmGR.getElement('number').getLabel(),
                        value: ritmGR.getValue('number')
                    },
                    {
                        label: ritmGR.getElement('short_description').getLabel(),
                        value: ritmGR.getValue('short_description') || ''
                    },
                    {
                        label: ritmGR.getElement('requested_for').getLabel(),
                        value: ritmGR.getDisplayValue('requested_for') || ''
                    }
                    // Add more fields as needed
                ]
            }
        };
        
        return new JSON().encode(response);
        
    } catch (e) {
        gs.error('Error in getRitmSummary: ' + e.message);
        return new JSON().encode({
            status: 'error',
            message: 'An unexpected error occurred.'
        });
    }
}

No I like to use a client callable ui action to open an ui page and print the name-value pairs from script include.

I tried first getting the data and then open die UI page handing over the response to ui page and also tried to just hand over the sysId of the record and retrieve data within the ui page ... but both did not work.

PLEASE could anyhone help me ... is urgent.

[Bhavya11 · Accepted solution]

Hi @Zod ,

create ui action :i have created for incident table you can create for sc_req_item table

script in ui action :

function showPage(){
	var gdw = new GlideDialogWindow('create_change_model');
	gdw.setSize(750,300);
	gdw.setPreference('table_name',g_form.getUniqueValue());
	gdw.render();
}

Script include: 

getRequtitemdetails :function(){
		try {
        var sysId = this.getParameter('sysparm_userId');
        
        if (!sysId) {
            return JSON.stringify({
                status: 'error',
                message: 'No sys_id provided.'
            });
        }
        
        var ritmGR = new GlideRecord('sc_req_item');
        if (!ritmGR.get(sysId)) {
            return  JSON.stringify({
                status: 'error',
                message: 'No RITM found with the provided sys_id.'
            });
        }
        
        // Prepare the response with label-value pairs
        var response = {
            status: 'success',
            data: {
                fields: [
                    {
                        label: ritmGR.getElement('number').getLabel(),
                        value: ritmGR.getValue('number')
                    },
                    {
                        label: ritmGR.getElement('short_description').getLabel(),
                        value: ritmGR.getValue('short_description') || ''
                    },
                    {
                        label: ritmGR.getElement('requested_for').getLabel(),
                        value: ritmGR.getDisplayValue('requested_for') || ''
                    }
                    // Add more fields as needed
                ]
            }
        };
        
        return JSON.stringify(response);
        
    } catch (e) {
        gs.error('Error in getRitmSummary: ' + e.message);
        return JSON.stringify({
            status: 'error',
            message: 'An unexpected error occurred.'
        });
    }

	},

Ui page   name is "create_change_model"

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">
 <j:set var="jvar_sys_id" value="${RP.getWindowProperties().get('table_name')}"/>   
<input id="record_sys_id" type="hidden" value="${jvar_sys_id}" />


<div id="response_container" style="margin-top: 20px;">
  <h3>Fetched Data:</h3>
  <p id="response_data">Loading data...</p> <!-- Placeholder text until data is fetched -->
</div>
</j:jelly>

Client script

$j(document).ready(function() {
    fetchData();
});

function fetchData() {
    var sys_id = $j('#record_sys_id').val();
    var grajax = new GlideAjax('CreateChangeRequest');
    grajax.addParam('sysparm_name', 'getRequtitemdetails');
    grajax.addParam('sysparm_userId', sys_id);
    
    grajax.getXML(function(response) {
        var answer = response.responseXML.documentElement.getAttribute("answer");
        
        if (answer) {
            console.log("Response Received: " + answer); // Log to console for debugging
            
            // Parse the JSON response
            var jsonResponse = JSON.parse(answer);
            var fields = jsonResponse.data.fields;
            
            // Build the HTML content
            var htmlContent = '<ul>';
            fields.forEach(function(field) {
                htmlContent += '<li><strong>' + field.label + ':</strong> ' + field.value + '</li>';
            });
            htmlContent += '</ul>';
            
            // Set the HTML content in the response container
            $j('#response_data').html(htmlContent);
        } else {
            console.error("No response received or empty response."); // Log error to console
            $j('#response_data').text("No data found.");
        }
    });
}

Output :

Please mark helpful & correct answer if it's really worthy for you.

Thanks,

BK

[Zod]

THANK YOU