Fetching custom table record details in UI Page

DeepikaM · ‎10-14-2024

Hi Team,

My requirement is to fetch details of record in UI Page.

When we open the record, we should have an ui action when we click on it, UI Page should pop up. That UI page should contain details of that particular record. Please let me know how can we achieve this

Sumanth16 · ‎10-14-2024

Hi @DeepikaM ,

Please refer below thread:

https://www.servicenow.com/community/developer-forum/display-records-on-custom-table-in-ui-page/m-p/...

https://www.servicenow.com/community/developer-forum/how-to-retrieve-data-from-custom-table-and-disp...

https://www.servicenow.com/community/developer-forum/ui-page-to-display-data-from-a-table-based-on-t...

If I could help you with your Query then, please hit the Thumb Icon and mark it as Correct !!

Thanks & Regards,

Sumanth Meda

View solution in original post

Akash4 · ‎10-14-2024

Hi Deepika,

Here is a basic idea to start with:

1. Write this script in the UI Action (we create UI Page name as record_details_page)

var dialog = new GlideDialogWindow('record_details_page');
dialog.setTitle('Record Details');

dialog.setPreference('sys_id', current.sys_id);

dialog.render();

2. Create a UI Page with following code:

<j:jelly xmlns:j="jelly:core" xmlns:g="glide">
<g:evaluate var="record">
var gr = new GlideRecord('incident'); //addYourTargetTableHere
if (gr.get($sp.getParameter(‘sys_id’))) {
record = gr;
}
</g:evaluate>

<g2:if test="${record}">
<h1>Details for Record: ${record.number}</h1>
<table style="width:100%">
<tr><td><b>Number:</b></td><td>${record.number}</td></tr>
<tr><td><b>Short Description:</b></td><td>${record.short_description}</td></tr>
</table>
</j:jelly>

Regards, Akash
If my response proves useful, please mark it "Accept as Solution" and "Helpful". This action benefits both the community and me.

DeepikaM · ‎10-15-2024

GlideDialogWindow is deprecated in Xanadu release. Any other solution please @Akash4

Akash4 · ‎10-15-2024

That’s true, give it a try by directly accessing the URL as follows:

1. UI Action as:

function openCustomUIPopUp() {
var recordSysId = g_form.getUniqueValue();
var tableName = g_form.getTableName();

var url = 'sys_ui_page.do?sys_id=<YOUR_UI_PAGE_SYS_ID>&sysparm_sys_id=' + recordSysId + '&sysparm_table=' + tableName;
//replace with the UI page sysID
window.open(url, '_blank', 'width=800,height=600');
}

2. You need a Server script in UI Page:

<g2:ui_page>

<server_script>
(function() {
var sysId = gs.getParameter('sysparm_sys_id');
var table = gs.getParameter('sysparm_table');
var gr = new GlideRecord(table);
if (gr.get(sysId)) {
data.record = {};
data.record.number = gr.getValue('number');
data.record.short_description = gr.getValue('short_description');
}
})();
</server_script>

<html>
<head>
<title>Record Details</title>
</head>
<body>
<h1>Record Details</h1>
<p>Number: ${record.number}</p>
<p>Short Description: ${record.short_description}</p>
</body>
</html>
</g2:ui_page>

Regards, Akash
If my response proves useful, please mark it "Accept as Solution" and "Helpful". This action benefits both the community and me.

DeepikaM · ‎10-15-2024

Hi @Akash4 , thank you for the response. By taking the reference of your solution I have written the code.

It is not passing sys_id, will share you screenshot. Please provide the feedback what went wrong.