Question

I have three dropdowns

First dropdown options are

option1
option2


2nd and third dropdowns are

optionA
OptionB

When I select option2 in first dropdown

I should remove optionA from both dropdowns.

When I select option1, my both dropdowns should repopulate with original values.

I am using the following code to remove from one dropdown only

Can anybody point me how to do two dropdowns at same time please.

<script type="text/javascript">
google.load("jquery", "1.4.2");
google.setOnLoadCallback(function() 
{
    var sites='#firstDDId';
    $('#firstDDId').change(function() 
            {
                if($(sites).val()=='Option1' ) 
                {
                        alert(" Please note, optionA will be removed"); 
                         $("#secondDDId option[value='OptionA']").remove(); 
                                         } 
               else
                {
                  var exists = false;
                  $('#SecondDDId option').each(function()
                  {
                        if (this.value == 'OptionA') 
                        {

                            exists = true;

                            return false;
                        }
                    }
                );

                    if (exists==false)
                    {
                        $("#SecondDDId").append('<option value="OptionA">OptionA</option>');
                    }

                 }  
        });



  });

</script>

Answer 1

Store your options first in an array and then you can repopulate your select options every time you need.