ClearOptions & addOption

[AnirudhKumar]

Intro:

One of the common requirements is to show only certain options in a selectbox conditionally, for example:

Assume there are 2 fields : Product and Company

If Product = Beverage,

Company needs to show 2 options - Pepsi and CocaCola

If Product = Electronics,

Company needs to show 2 options - Apple and Samsung

Solution:

The easiest way to do this is using clearOptions and addOption.

Whenever there is a change to Product field, we clear all the options in Company field using clearOptions.

And depending on the Product value, we add the required options to Company field through addOption.

In order to detect changes to the Product field, we need an onChange client script

Type : OnChange

Field : Product

Script :

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

    g_form.clearOptions('company');
    if (newValue == 'beverage')
	{
        g_form.addOption('company', 'pepsi', 'Pepsi', 1);
        g_form.addOption('company', 'cocacola', 'CocaCola', 2);
    }
	else if (newValue == 'electronics')
	{
        g_form.addOption('company', 'apple', 'Apple', 1);
        g_form.addOption('company', 'samsung', 'Samsung', 2);
    }

}