Adventures in Service Portaling: Populate Catalog Variable Values through the URL

[Brad Tilton]

There's a pretty common use case in ServiceNow that goes something like this: A new user is onboarded and some sort of automation kicks off an onboarding process in ServiceNow. As part of the process ServiceNow sends an email to the hiring manager with a url that points to an order guide or catalog item. In that URL you might have included some url parameters that will populate some of the variables to help the hiring manager out and also to reduce the possibility or errors. In order to accomplish this you would use an onLoad catalog client script on the order guide or catalog item you're loading. The script commonly looks something like this:

function onLoad() {
       //Use the 'getParameterValue' function below to get the parameter values from the URL   
       var user = getParameterValue('sysparm_user');
       if (user) {
               g_form.setValue('user_variable', user);
       }
}
function getParameterValue(name) {
       var url = document.URL.parseQuery();
       if (url[name]) {
               return decodeURI(url[name]);
       } else {
               return;
       }
}

This works really well and is documented in a few places including one of my blog posts. However, this script will not work when your order guide or catalog item is rendered within Service Portal. The reason is that Service Portal blocks a number of javascript global objects from running within client scripts including document and prototype which are both used in line 11.

So what do you do if you want to use url parameters to populate values into catalog artifacts in the Service Portal? I recently discovered that the top object is not blocked, so I tried modifying this script a bit and it seems to work. I will admit that this method is more of a workaround/hack, but it's the only way I've been able to populate a variable from the url through the Service Portal so far.

function onLoad() {
       //Use the 'getParameterValue' function below to get the parameter values from the URL   
       var user = getParameterValue('sysparm_user');
       if (user) {
               g_form.setValue('user_variable', user);
       }
}
function getParameterValue(name) {
       name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
       var regexS = "[\\?&]" + name + "=([^&#]*)";
       var regex = new RegExp(regexS);
       var results = regex.exec(top.location);
       if (results == null) {
               return "";
       } else {
               return unescape(results[1]);
       }
}

So in this case if your url included &sysparm_user=Brad at the end then the value 'Brad' would be populated into the user_variable variable. Something to note is that this code snippet should be used within a client script or catalog client script on a form you're rendering through the Service Portal. If you're working within a widget and want to use a url parameter you would want to use angular's $location service.

Feel free to leave any feedback, and if anyone has a better way to do this please let us know in the comments.