Order Guide - Hide Cascading Variables, for Servic... - ServiceNow Community
Brent Sutton
Mega Sage

Problem Statement

ServiceNow states that it is best practice to avoid DOM manipulation in your client scripts. Anyone that has run a HealthScan on their instance will attest to a focus on this area. As of the ServiceNow London release, client scripts run in "strict mode" as default. Strict mode prevents direct access to the Document Object Model (DOM) through the "Isolate script" toggle.

Unfortunately, the ServiceNow docs prescribed method to hide cascaded variables on the desktop uses DOM techniques. The example script fails, when created in London (or above), as the default strict mode prevents client scripts from directly accessing the DOM.

Goals for new "Hide Cascading Variables" Client Script

  1. Remove all DOM techniques from the client script.
  2. Maintain a single Client Script for both Service Portal and Desktop.

This article is not an end-to-end guide explaining techniques to cascade an order guide variable or how to use service catalog variable sets. There is already good sources of information for these topics on ServiceNow docs.

Hide Cascading Variables, on Service Portal and Desktop, in one Client Script (no direct access to DOM)

When exploring the above problem statement, I came up with a solution which fits the goals I set out.

onLoad Client Script Configuration: 

Client Script FieldsValue
Name:<Name of your Client Script>
Applies to:A Variable Set
UI Type:All
Type:onLoad
Variable Set:<Name of your Variable Set>
Applies on a Catalog Item view:true (ticked)


find_real_file.png

Code:

function onLoad() {
	/*in strict mode ("Isolate script" is true) we don't have access to the window object so it will return null for Service Portal/Mobile and desktop
	* instead we use a try/catch block to test if we have access to g_service_catalog which is only available in Service Portal/Mobile
	*/
	
	//create array with internal variable names to hide
	var varsToHide = ["your_variable_1","your_variable_2","your_variable_3"];
	
	/*Service Portal/Mobile code
	____________________________________________________________________________________________________*/
	try {
		//check if we are in an order guide using the g_service_catalog api for Service Portal and Mobile
		var isOrderGuide = g_service_catalog.isOrderGuide();

		if (isOrderGuide) {
			//call function to hide the fields on the catalog items if this is an order guide.
			hideVariables(varsToHide);
		}
	}
	/*Desktop code
	____________________________________________________________________________________________________*/
	catch(e) {
		/* test that error message relates to g_service_catalog then execute desktop only code. 
		*/
		if (/g_service_catalog is not defined/.test(e.message)) {
			var item = g_form.getControl("current_item"); //sys_id of the current item
			var guide = g_form.getControl("sysparm_guide"); //sys_id of the order guide

			//check if both HTML elements were returned.
			if (item == null && guide == null) {
				return; //return as we are not in a order guide
			}

			//test that both HTML elements were returned and whether they are equal to each other.
			if (item != null && guide != null && item.value == guide.value) {
				return; //return as we are on the "Describe Needs" section of the order guide
			}
			hideVariables(varsToHide); //hide the variables if the above conditions weren't met.
		}
	}

	function hideVariables(varsArray){

		for (var i=0; i< varsArray.length; i++) {
			//variables to be hidden need to be not mandatory before setting display to false.
			g_form.setMandatory(varsArray[i],false);
			g_form.setDisplay(varsArray[i],false);
		}
	}
}

 

The described technique tests for the availability of g_service_catalog.isOrderGuide() API which is only available in Service Portal/Mobile. If we get an error message we test if it relates to "g_service_catalog" then revert to the alternative desktop code. The desktop code utilises the g_form.getControl(String fieldName) API to extract the guide and item values (sys_id's) for the required compare.

There you have it, an easy to manage, single client script, to hide cascading variables on both Service Portal and Desktop.

If you found this information valuable then please remember to mark as helpful and bookmark for later use.

 

Comments
jerryyin
Tera Explorer

Thanks for sharing this. Will use this as template client script that works on both portal and desktop.

Seth D
Tera Contributor

Hi - I have tried your solutions (both the one in this article, and the first solution in https://community.servicenow.com/community?id=community_question&sys_id=dfe047a5db98dbc01dcaf3231f961990) and I cannot get it to work on the Desktop (requested item level). I have used your code successfully to hide cascading variable sets on the Portal, however now that I have a need to hide on the Desktop, I cannot get it to work. I'm on San Diego.

 

Brent Sutton
Mega Sage

Hi@Seth D ,

I just tested the script in San Diego and it worked fine. Have you set the catalog client script to run under 'UI Type' All? (see my screenshot at the top of the article)

Did this suggestion fix your issue?

Brent

P.S. If you found this article helpful then please feel free to bookmark it and/or tick as helpful so other community members can easily find it.

Attila Nemes
Tera Contributor

Hey!

This is kind of unrelated, but can I have a few questions regarding cascading vars in SP?

Can lookup select boxes cascade?
Do the values change when the select box that cascaded gets changed?

I wanted to write an onChange client script on a cascaded value, but it doesn't seem to be the case for me. Maybe I missed something? Thanks for the above post!

Brent Sutton
Mega Sage

Hi Attila,

This script doesn’t cascade your variables but merely hides them.

To test whether the cascade side is working then simply don’t hide the variable in the child catalog item and make the change in the describe needs section of the order guide. I suspect your client script is not triggering on the child catalog item as it is not loaded (in focus) when the cascade update is made. I haven’t tested this theory but that is probably why it isn’t triggered.

Brent

P.S. If you found this article helpful then please feel free to bookmark it and/or tick as helpful so other community members can easily find it.

joymorales
Giga Guru

Good morning, @Brent Sutton.

 

Thank you for your information on hiding variables set on an order guide's Choose Options tabs.  I am testing your solution, but ran into an issue on which I would like your help.

 

My order guide variables set has variables that display via UI policy when the preceding variable (Type: Yes/No) is answered with Yes.  The script solution above is not hiding these variables on the order guide Choose Options tab as long as the preceding variable is set to Yes and the UI Policy displays the related variables.  The related variables are not set to Mandatory on the variable set, but they are in the UI Policy's UI Action record.  I changed their Mandatory value from "True" to "Leave alone" and then to "False", but the order guide still displays them on the Choose Options tab of the order guide as long as the Yes/No preceding variable is set to Yes.

 

Any suggestions on how I can resolve this issue?

 

Thanks again.

Brent Sutton
Mega Sage

Hey @joymorales ,

 

The UI Policy always executes after client scripts so when there is conflicting logic the UI policy logic will be applied.

Brent

 

joymorales
Giga Guru

Thanks @Brent Sutton.  Greatly appreciated.  In my order guide, the variable fields that display via UI policy are already displayed on the "Describe Needs" section form and before I click on the Choose Options button to move to the "Choose Options" section.  By chance, is there a possible creative way to get the script to run when I click the Choose Options button and not before (since before that, the Choose Options section is not even accessible)?  Maybe it's not possible, but just wondering.  Thanks again.

Brent Sutton
Mega Sage

Hey @joymorales,

 

Generally, you don't want your cascading variables to be dynamic due to the issues you are facing.

 

If you really must have the show/hide functionality then you may be able to achieve this by moving the UI policy to the order guide itself (out of the variable set) but keep my script in the variable set to it is applied to all the child items.

The other way would be to move the UI Policy logic to a catalog client script and play with the order that the client scripts are run.

Can't confirm if either will work for your situation but would be worth investigating.

 

Let me know if this worked for you,

 

Brent

P.S. Please mark as helpful if this answered your question.

sbh
Tera Guru

The reminder that the variables can't be mandatory was particularly helpful, and so was the screenshot (especially checking 'isolate script'). Thank you!

Brent Sutton
Mega Sage

Thanks for the kind comments @sbh.

Remember to bookmark and add kudos to the article, if you found it helpful.

tahnalos
Tera Guru

Hi Brent

 

Quick Question, in your catch block there appear to be three different possibilities.

- First If block checks to see if both the Item and Guide are null.  Supposedly this means that the user is not in an order guide or in an actual item.

- Second scenario checks to see if both the Item and Guide are equal to each other and not null, meaning that user is in the Needs portion of the Order Guide which we need to fill out.

- Third scenario applies if the first and second scenarios do not apply.

 

But what when the Item is not null and the Guide is (meaning that you're in the item that is outside the guide)?  How does this catch block catch this particular scenario?  

Brent Sutton
Mega Sage

Hi @tahnalos ,

 

Neither "current_item" or "sysparm_guide" parameters are available when the item is opened outside of the order guide. These variables will have a "null" value:

 

 

var item = g_form.getControl("current_item"); //sys_id of the current item
var guide = g_form.getControl("sysparm_guide"); //sys_id of the order guide

 

 

The following code then prevents hiding the variables when opened outside of the order guide:

 

 

if (item == null && guide == null) {
	return; //return as we are not in an order guide
}

 

 

Hope this helps,

 

Brent

 

 

tahnalos
Tera Guru

Right ok, I thought that item was defined in that scenario but it is not.

 

Thanks, this makes sense now.

Tushar Walveka2
Tera Guru

TusharWalveka2_1-1695379043531.png

Brent Sutton
Mega Sage

Hi @Tushar Walveka2, your example is very similar to my code in the article. Was there something additional that I was missing? 

Nathan Okh
Mega Sage

Worked perfect for me. I had to also remove some UI Policies that effected some of the fields, all in all great article and helpful.

"You are a gentleman and a scholar..."

Much appreciated.

Brent Sutton
Mega Sage

Thanks for the kind comments @Nathan Okh. Glad this article helped you. Brent

Version history
Last update:
‎02-24-2019 06:59 PM
Updated by: