onChange() Client Script looking at a form variable and modifying options in a Variable Set variable

[FacundoA]

Hi! Can anyone tell me how to change or modify the options in a Select Box variable from a Variable Set using an onChange() Client Script that looks for a variable in the form?

The idea is that when the user selects a country in the form, it should affect the options in the Select Box from the Variable Set.

I created a Client Script that checks which country is selected and then uses GlideAjax to determine the selected country. In my Script Include, I return options = []; with values and labels. I can see this variable in console.log(), and it looks fine. However, I’m not sure how to access the Variable Set variable through the Catalog Client Script.

I tried different methods, such as name_variable_set.name_variable_from_variable_set, but it didn’t work. ex.  g_form.clearOptions('name_variable_set.name_variable_from_variable_set'); 

Can you please help me? Is it possible to achieve what I'm looking for?

[Sandeep Rajput]

@FacundoA You should be able to access the variable directly without using the variable set name as prefix.

g_form.clearOptions('name_variable_from_variable_set'); 

should just work fine and clear the options.

[FacundoA]

Hi @Sandeep Rajput thanks so much for helping me. I tried using that but it doesn't work 😞

This is my Client Script and my Script Include, maybe this bring more information.

//Client Script

function onChange(control, oldValue, newValue, isLoading) {
    if (isLoading || newValue == '') {
        return;
    }
	
    fillVariableSet(newValue);
	
}

function fillVariableSet(newValue) {
	
    var ga = new GlideAjax('foodAndBeverageVariableSet');
    ga.addParam('sysparm_name', 'getOptions');
    ga.addParam('sysparm_work_location', newValue);
    ga.getXML(getVariableSetVars);


    function getVariableSetVars(response) {
        var answer = response.responseXML.documentElement.getAttribute('answer');
        console.log("Raw answer from GlideAjax: " + answer);
        g_form.clearOptions('conference_food_and_beverages'); 

        var options;
        try {
            options = JSON.parse(answer);
            console.log("Parsed options: " + JSON.stringify(options));
        } catch (e) {
            console.error("Error parsing options: " + e.message);
            return;
        }

    }
}

//Script Include

var foodAndBeverageVariableSet = Class.create();
foodAndBeverageVariableSet.prototype = Object.extendsObject(AbstractAjaxProcessor, {
    getOptions: function() {
        var ConferenceRoomServices = gs.getProperty('COF-ConferenceRoomServices');
        var Argentina = gs.getProperty('Argentina');

        var result = [];

        try {
            var country = this.getParameter('sysparm_work_location');
            var gr = new GlideRecord('sc_cat_item_producer');
            
			if (gr.get(ConferenceRoomServices)) {

                if (country == Argentina) {

                    result.push({
                        value: 'arg_option_1',
                        label: 'Argentina Option 1'
                    });
                    result.push({
                        value: 'arg_option_2',
                        label: 'Argentina Option 2'
                    });
                } else {
                    gs.log("Country is not Argentina");

                    result.push({
                        value: 'default_option_1',
                        label: 'Default Option 1'
                    });
                    result.push({
                        value: 'default_option_2',
                        label: 'Default Option 2'
                    });
                }

            } else {
                gs.log("No record found for ConferenceRoomServices: " + ConferenceRoomServices);
            }
        } catch (e) {
            gs.log("Error in Script Include foodAndBeverageVariableSet: " + e.message);
            result = [];
        }

        return new JSON().encode(result);
    },

    type: 'foodAndBeverageVariableSet'
});

That's the logic I was looking for, depends the country you are selecting, change the options into a select box from multi row variable set. Maybe I'm doing something wrong and I don't know.

Thanks you so much again for helping me! 😄 

[Sandeep Rajput]

@FacundoA If the select box is a part of Multirow variable set then you will not be able to access it outside the multirow variable set (from a catalog client script of a record producer or a catalog item). I recommend adding the onChange script inside the Multirow variable set itself and clearing the options directly.

[FacundoA]

Hi! I tried using that but it doesn't work too 😞

//Client Script 

function onChange(control, oldValue, newValue, isLoading) {
    if (isLoading || newValue == '') {
        return;
    }

    fillVariableSet(newValue);
	
}

function fillVariableSet(newValue) {
	
    var ga = new GlideAjax('foodAndBeverageVariableSet');
    ga.addParam('sysparm_name', 'getOptions');
    ga.addParam('sysparm_work_location', newValue);
    ga.getXML(getVariableSetVars);


    function getVariableSetVars(response) {
        var answer = response.responseXML.documentElement.getAttribute('answer');
        console.log("Raw answer from GlideAjax: " + answer);
        g_form.clearOptions('conference_food_and_beverages'); //Don't clearing the select box 

        var options;
        try {
            options = JSON.parse(answer);
            console.log("Parsed options: " + JSON.stringify(options));
        } catch (e) {
            console.error("Error parsing options: " + e.message);
            return;
        }

    }
}

//Script Include

var foodAndBeverageVariableSet = Class.create();
foodAndBeverageVariableSet.prototype = Object.extendsObject(AbstractAjaxProcessor, {
    getOptions: function() {
        var ConferenceRoomServices = gs.getProperty('COF-ConferenceRoomServices');
        var Argentina = gs.getProperty('Argentina');

        var result = [];

        try {
            var country = this.getParameter('sysparm_work_location');
            var gr = new GlideRecord('sc_cat_item_producer');
            
			if (gr.get(ConferenceRoomServices)) {

                if (country == Argentina) {
                    result.push({
                        value: 'arg_option_1',
                        label: 'Argentina Option 1'
                    });
                    result.push({
                        value: 'arg_option_2',
                        label: 'Argentina Option 2'
                    });
                } else {
                    gs.log("Country is not Argentina");

                    result.push({
                        value: 'default_option_1',
                        label: 'Default Option 1'
                    });
                    result.push({
                        value: 'default_option_2',
                        label: 'Default Option 2'
                    });
                }

            } else {
                gs.log("No record found for ConferenceRoomServices: " + ConferenceRoomServices);
            }
        } catch (e) {
            gs.log("Error in Script Include foodAndBeverageVariableSet: " + e.message);
            result = [];
        }

        return new JSON().encode(result);
    },

    type: 'foodAndBeverageVariableSet'
});

That's the logic I was looking for, depends the country you are selecting, change the options into a select box from multi row variable set.
Maybe with my scripts could help more to understand what I'm doing wrong. Thanks so much for trying to help me! 😄