Display List on UI Page

[CarlJSchmidt]

Hi there,

I would like to implement a UI Page which displays records from a filtered table and already found this post on how to achieve this using an iframe: How Display a table list View In UI Page. - ServiceNow Community.

Therefore, the client script of the UI Page contains something like this:

var tableContainer = document.getElementById('tableContainer');
var query = ...;
var tableIFrame = '<iframe src="incident_list.do?sysparm_query=' + query + '" ' + '></iframe>';

tableContainer.innerHTML = tableIFrame;

However, I would also like to adapt the HTML of the document element contained in the iframe, but adding this line to the client script of the UI Page returns an empty document without any content (and also doesn't feel like the right approach).

var iframeDoc = document.getElementsByTagName('iframe')[0].contentDocument;

So as an alternative, I thought about fetching the HTML code via an XMLHttpRequest from the client script of the UI Page. As this is not possible, I implemented a Script Include for this task, so the the XMLHttpRequest (by way of GlideHTTPRequest) is executed server side. The client script then only calls the Script Include via GlideAjax.

The issue with this approach however is, that the GlideHTTPRequest requires some kind of authentication to be able to process the request.

So I was wondering, if it is possible to forward the authentication mechanism that the user uses when calling the GlideAjax to the GlideHTTPRequest in the Script Include. ServiceNow already knows that the user is allowed to execute the GlideAjax, so I assume the information must be available in the context of the GlideAjax call.

Thank you in advance.

Any help is much appreciated!

[CarlJSchmidt · Accepted solution]

Hi there,

will answer my own question in case anybody else faces a similar challange.

I ended up implementing the onload function for the iframe, so the code might look like this:

var tableContainer = document.getElementById('tableContainer');
var query = ...;
var tableIFrame = '<iframe src="incident_list.do?sysparm_query=' + query + '" ' + ' onload="someFunction()"></iframe>';

tableContainer.innerHTML = tableIFrame;

function someFunction() {
 var iframe = document.getElementsByTagName('iframe')[0];
// Implement modifications of iframe elements here.
}

Hope this will be helpful!

[Paul Kunze]

Hi, thanks for this contribution. Already the question was helpful for me.

I worked on something similar and want to share what I found out.

You can use this code to access the HTML contents within the iframe:

var iframe = document.getElementsByTagName('iframe')[0];
var iframeWindow = iframe.contentWindow ? iframe.contentWindow : iframe.contentDocument.defaultView;

And with that you can even use objects like g_form or g_list (depending on the content of the iframe):

var iframe_g_list = iframeWindow.g_list;
var selectedRecords = iframe_g_list.getChecked(); //comma separated sys_ids