Service Catalog - display different option in select box depend on another select box

[Wing Lee1]

Hello guys,

I have three 2 Lookup Select Box and one Select Box

1. Equipment (Lookup Select Box) - (Referenced appropriate table)

2. Brand (Lookup Select Box) - (Referenced appropriate table)

3. Model (Select Box)

My expectation is, when I select Computer in the 1st select box, the 2nd select box will display appropriate options.

The same for the 2nd select box and the 3rd select box.

However, my code is not working as below.

I'm using "Catalog Client Scripts" with Type : onChange settings

Or any other method is better to achieve this?

Thanks Bros!!!

function onChange(control, oldValue, newValue, isLoading) {
    if (isLoading || newValue === '') {
        return;
    }
    var gr = new GlideRecord('u_cmdb_ci_second_option');
    if (newValue == 'Computer') {
        g_form.clearOptions('second_options');
        gr.addQuery('name', 'Computer');
        gr.query();
        while (gr.next()) {
            g_form.addOption('second_options', gr.getValue('name'), gr.getValue('name'));
            //g_form.addOption('second_options', gr.name, gr.name);  <-- Also tried
        }
        g_form.addOption('second_options', 'other', 'Others - Computer');
    } else if (newValue == 'TV') {
        g_form.clearOptions('second_options');
        gr.addQuery('model', 'TV');
        gr.query();
        while (gr.next()) {
            g_form.addOption('second_options', gr.getValue('name'), gr.getValue('name'));
            //g_form.addOption('second_options', gr.name, gr.name);  <-- Also tried
        g_form.addOption('second_options', 'other', 'Others - TV');
        }
    }
}

[Mohith Devatte · Accepted solution]

Hello @Wing Lee1 ,

Using Glide record in client script is not a best practice as it is a server side API .

please shift the glide record logic to script include and then return set of options in an array and then loop  the array using for loop and then add the options

syntax would be 

g_form.addOption('variable_name', 'choice_1_backned_name', 'Choice1_label);

Hope this helps 

Mark my answer correct if this helps you 

Thanks

[Wing Lee1]

Thank you Mohith.

Let me try.