CODEWITHSUNDEEP
jquerydrop-down-menu
user962449
user962449

Reputation: 3873

jquery changing select dropdown values

I'm trying to change a dropdown select menu with jqquery by selecting a certain option from a dropdown menu.

Example:

<select name="options">
    <option value='3'>Option 3</option>
    <option value='5'>Option 4</option>
    <option value='7'>Option 5</option>
</select>

The other dropdown:

<select name="rounds">
    <option value='1'>1</option>
    <option value='3'>3</option>
    <option value='5'>5</option>
    <option value='7'>7</option>
</select>

Say someone selects option 4, then the other dropdown will dynamicly change its values to say:

<select class='button' name="rounds">
    <option value='23'>23</option>
    <option value='5'>5</option>
    <option value='12'>12</option>
</select>

Each option will change the rounds menu and users can toggle between options. Anyway to do this? is there a demo online?

Upvotes: 1

Views: 6650

Answers (2)

Pranay Rana
Pranay Rana

Reputation: 176896

on Change when you need to remove all otpins something as below 

$("[name='options']").change(function() 
    { 
        val = $(this).val(); 
        $("[name='rounds'] >option").remove();

than in if conditon add items one by one as per you needs 

var opt ;
if(val == 4)
{
  opt = {
        val1 : 'text1',
        val2 : 'text2'
    };
}
if(val ==1 )
{
          opt = {
        val1 : 'text3',
        val2 : 'text4'
    };
}
    $.each(opt, function(val, text) {
        $("[name='rounds']").append(
            $('<option></option>').val(val).html(text)
        );
    });

  }); 
});

Upvotes: 2

Kamal
Kamal

Reputation: 2180

I hope this is what you are looking for checkout the link

http://api.jquery.com/val/#val

Upvotes: 1

Related Questions