Catalog Variable Set issue with onChange Client Script(s)

[bvlo]

I am attempting to utilize a variable set for several different workflows and I'm running into an issue with getting the variables to display when I want them to on the form. The crux of my issue is as follows.

I have one select box field (called Type) containing three different options. When the user selects one of the choices, I want some of the variables from the variable set to be displayed, and then if the user changes this choice, I want the old variables to be cleared and no longer visible and the new variables associated with the updated choice to be displayed on the form.

My approach to these requirements was to create 4 onChange Catalog Client scripts that fire when the user changes the Type field :

Clear (order of 5)

Add (order of 10000)

Change (order of 11000)

Delete (order of 12000)

I only have these 4 scripts, one variable set (order values fall between 5 and 10000) and one variable (Type) active at this point.  

The Clear is only doing the following:

function onChange(control, oldValue, newValue, isLoading) {

   if (isLoading || newValue == '') {

      return;

   }

 g_form.setVisible('my_variable_set_name', false);

            console.log('Clear');

}

The Add/Change/Delete scripts are very straightforward:

 

function onChange(control, oldValue, newValue, isLoading) {

    if (isLoading || newValue == '') {

        return;

    }

    if (g_form.getValue('gl_request_type') == 'Extend GL Account') {

        g_form.setVisible('company_codes', true);

        g_form.setVisible('account', true);

        g_form.setVisible('chart_of_accounts', true);

        g_form.setVisible('reason_for_request', true);

 

                        console.log('Extend');

        }

    }

 My train of thought here is every time the user changes the Type field, hide all the variables in the variables set (clear script) -> then based on what the new selection is in the Type field (Add/Change/Delete) run the corresponding script.

 Everything works as I want it the first time the page is loaded, if I select either Add/Change/Delete in the Type field I see in my console log the Clear script and corresponding Add/Change/Delete script run and I get the desired variables on the page. The issue is when I update Add/Change/Delete again, all the fields are hidden on the page (console logs shows me the clear script ran) but the new fields are not displayed despite the log showing me the appropriate script ran. I know the appropriate script works because it works the first time around. 

I am really at a loss at what to look at or troubleshoot at this point. In anticipation of this being asked, I don’t see how I could utilize a UI policy to accomplish this given logic of when I need these variables displayed or cleared.  Thank you in advance.

[bvlo]

Janos,

Given that users have not populated the selected Type yet, I have set the variables to start out not visible. Apologies If I am missing something obvious here, but how can I use a UI Policy to accomplish the following:

Add choice under Type -> don't show variable "account" 

Change choice under Type -> show variable "account" 

Delete choice under Type -> show variable "account"

I need to ensure that if the user initially selects "Delete", realizes that they made a mistake, and selects "Add" that the account variable is no longer visible. Normally I would use the "Reverse if False" option on the UI Policy but since I have three choices there will be a conflict. My initial train of thought was that I needed three UI policies (one for each option) but maybe this can be accomplished using two UI policies and leveraging "is one of" in the condition builder? 

Your point about clearing the values is a good one and at this point, I would be ok with not clearing the values but I am more concerned about the variables displaying when they should. 

Thank you for your reply

[-O- · Accepted solution]

Yeah, UI and Data policies have been implemented kinda' backwards. Those imply one should create multiple UI Policies for one field each matching different scenarios. I find it is simpler and more robust to create one UI Policy per field per UI Policy action* and mark it "Reverse if false". In this case the UI Policy statement/condition for "Account" would be something like:

if "Type" is one of "Change" or "Delete" apply UI Policy action set visible to true.

Now if someone selects either of the two types, account will become visible, otherwise it will not be visible.

Having a single point of configuration (a single UI Policy) for a field makes it easier to manage too: avoiding conflict between policies or fine-tuning the sequence of the policies will become non-issues.

Do make sure if for the same field you have both visibility and mandatory policies, make mandatory ones have a smaller order no. than visibility ones. The reason being mandatory policies trounce visibility so if the not-mandatory policy is applied to a mandatory field after the visibility one, the visibility one will make no effect.

*)  I mean if you want to control both visibility, read-only- and mandatory states, I create a separate UI Policy for each action.

[Mark Roethof]

Hi there,

Question: What is the reason for not using UI Policies here? Why going for a scripted solution here? Don't see any reason for this looking at the code you are sharing.

If my answer helped you in any way, please then mark it as helpful.

Kind regards,
Mark
2020, 2021 ServiceNow Community MVP
2020, 2021 ServiceNow Developer MVP

---

LinkedIn
Community article, blog, video list

[Gaurav Shirsat]

Hello

I don't see there need of Writing an onChange Catalog Client Script.

You just need to write UI Policy on Your Variable Set.

Select your Condition. at what condition you want to show the variables.

save the form.

then in UI Policy Action click on New UI Action for each variable separately and add variable name and visibility false/true as per your req.

as simple as that.

refer

Please Mark Correct and Helpful
Thanks and Regards
Gaurav Shirsat