Workspace Client Script UI action

Rashim Walia · ‎03-24-2023

Hi,

I am trying to fetch all the fields from the current form in "data" and pass it on to the UI page. Currently, we are doing this in UI Macro that is further calling UI Page.

Need your guidance how to write this functionality in Workspace client Script UI action. Appreciate your help, Thanks!!

var datatemp={};
for(var x = 0; x != g_form.elements.length; x++)
{
//getting all fields in the form
datatemp[g_form.elements[x].fieldName]=g_form.getValue(g_form.elements[x].fieldName);
console.log(g_form.elements[x].fieldName+':'+datatemp[g_form.elements[x].fieldName]);
}
var data="'"+JSON.stringify(datatemp)+"'";

var dialog = new GlideDialogWindow("Search Data");
dialog.setTitle("Search Data"); //Set the dialog title
dialog.setPreference("data",data);
dialog.render();

Punit S · ‎03-24-2023

Here's another way to do it.

Create a UI page and add the following code to it:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>My UI Page</title>
  <script>
    function passData() {
      var data = {
        "field1": "value1",
        "field2": "value2"
      };
      var url = "/nav_to.do?uri=incident.do?sys_id=-1&sysparm_query=";
      var encodedData = encodeURIComponent(JSON.stringify(data));
      url += encodedData;
      window.location.href = url;
    }
  </script>
</head>
<body>
  <h1>My UI Page</h1>
  <button onclick="passData()">Pass Data</button>
</body>
</html>

This code defines a function passdata( ) that creates a data object and encodes it as a URL parameter. When the user clicks the "Pass Data" button, the function sets the current URL to the URL of a new incident form with the encoded data added as a parameter.

Create a UI action that opens the UI page you just created:

(function() {
  var url = '/sys_ui_page.do?sys_id=<UI_PAGE_SYS_ID>';
  action.setRedirectURL(url);
})();

Replace <UI_PAGE_SYS_ID>with the sys ID of the UI page you created in step 1.

When the user clicks the UI action, the UI page will open, and the "Pass Data" button will be visible. When the user clicks the "Pass Data" button, they will be redirected to a new incident form with the data encoded as a parameter in the URL. You can retrieve this data in the new form using a script like this:

var urlParams = new URLSearchParams(window.location.search);
var encodedData = urlParams.get('sysparm_query');
var data = JSON.parse(decodeURIComponent(encodedData));

Please mark my answer correct/helpful in case it adds value and moves you a step closer to your desired ServiceNow  solution goal. 

Thanks,
Punit

Rashim Walia · ‎03-24-2023

Actually we already have an existing UI Page that is consuming "data" from the existing Macro. But Macros don't work for the Agent workspace thats why we have created a UI action.

We simply need to pass the "Data" component that has string of all the fields already in the UI action. I guess we just need the correct way of passing the "data" component in the URL.

Below method for the passing the "data" component is not working. Do you know any way to get it passed:

g_modal.showFrame({

title: 'Search Data',
url: '/ui_page.do?sys_id=47dc71c3db7af3806yuytyutu19fb?data=' + data,
size: 'lg'
});

Punit S · ‎03-24-2023

To pass data from a UI action to a UI page in ServiceNow, you can use the urlParm() function to encode the data and include it as a URL parameter. Here's an example of how you can modify the g_modal.showFrame() code to pass the "data" component as a URL parameter:

To pass data from a UI action to a UI page in ServiceNow, you can use the urlParm() function to encode the data and include it as a URL parameter. Here's an example of how you can modify the g_modal.showFrame() code to pass the "data" component as a URL parameter:
g_modal.showFrame({
    title: 'Search Data',
    url: '/ui_page.do?sys_id=47dc71c3db7af3806yuytyutu19fb&' + urlParm({ data: data }),
    size: 'lg'
});

Please mark my answer correct/helpful in case it adds value and moves you a step closer to your desired ServiceNow  solution goal. 

Thanks,
Punit

Rashim Walia · ‎03-24-2023

Thanks Punit !!

Could you please help ow to declare urlParm function as I am getting below error while running the example you have mentioned: