change selects value onchange of another select

Question

i start learning jquery few days ago, and i like it very much. but now i have a problem, that can't solve alone.

i have two selects

<select id="select1">
  <option value="1">1day</option>
  <option value="2">2day</option>
  <option value="3">3day</option>
</select>

<select id="select2">
  <option value="1">1day</option>
  <option value="2">2day</option>
  <option value="3">3day</option>
</select>

i need to set #select2 the same value with #select1, when #select1 changes

i've red some questions about select tag here, but i need to set "selected" attribute to that option, which have the same value. how can i do it?

Thanks

score 11 · Accepted Answer · answered May 29 '10 at 12:19

11

To set the value use .val() like this:

$(function() { //run on document.ready
  $("#select1").change(function() { //this occurs when select 1 changes
    $("#select2").val($(this).val());
  });
});

You can see a working demo here

This would set <select id="select2"> to the same value as the other one has. .val(vale) selects the <option> that has the corresponding value in the <select>, also de-selecting the previous selection. You use .val() without parameters to get the currently selected <option>'s value.

answered May 29 '10 at 12:19

Nick Craver

623,446
136
1,297
1,155

hmm, that's probably what he is looking for but you need to wrap your code in ready handler as well as onchange event because he seems to be a noob. – Sarfraz May 29 '10 at 12:20
Nice!, one suggestion infact we can avoid $ on the first dropdown again and can be done with $("#select2").val(this.value); – Raghav May 29 '10 at 15:23
@Raghav - You're thinking of input elements, you can't use .value on a select :) – Nick Craver May 29 '10 at 16:31
This is perfect, man I love stackoverflow...exactly what I needed! – Rocco The Taco Jun 18 '12 at 15:27

change selects value onchange of another select

1 Answers1

Linked