Automatically sets second select field value

Question

So basically I need to make feature that if you select something from first select box, it will be automatically selected in second select box too, and if you will change anything in second select box, it will be changed automatically in first select box too. Here is how far I'm currently am, I have fixed, if someoen changes the first select box value, but I'm not sure how to make the second select box value the same as first, and vice versa. - http://jsfiddle.net/3Tt7N/5/

Hope you can help me with this ;)!

possible duplicate of [How to make the value of one select box drive the options of a second select box](http://stackoverflow.com/questions/2603539/how-to-make-the-value-of-one-select-box-drive-the-options-of-a-second-select-box) — Marc B, Mar 20 '12 at 15:28

score 1 · Accepted Answer · answered Mar 20 '12 at 15:33

1

Basically, what you need to do is gather the value '.val()' of the first table, and set that as the parameter for the second tables' .val(). It could potentially look like this

$("#table2").val( $("#table1").val(cars) );

But that's just ugly... so instead, we assign it to a var (one you chose to name cars) and pass that variable into the corresponding tables '.val()' method.

$("#table1").change( function() {
  var cars = $("#table1").val();
  $("#table2").val(cars);
});

$("#table2").change( function() {
  var cars = $("#table2").val();
  $("#table1").val(cars);
});

Proof: http://jsfiddle.net/iredmedia/jPNYK/

answered Mar 20 '12 at 15:33

iRedMedia

138
7

Thanks! Accepted as first reply! – Vdas Dorls Mar 20 '12 at 15:43
;) Thank you! I also must say, it's the cleanest. There is a way to do this in one function call, but it's that power of jQuery that i so love. – iRedMedia Mar 20 '12 at 15:49

score 1 · Answer 2 · answered Mar 20 '12 at 15:34

1

here you go. http://jsfiddle.net/jYqJJ/

answered Mar 20 '12 at 15:34

Teun Pronk

1,367
12
24

score 0 · Answer 3 · answered Mar 20 '12 at 15:36

0

try this:

JS

$("#table1").click( function() {
  $("#table2").val($("#table1").val()) ;
 });
$("#table2").click( function() {

  $("#table1").val($("#table2").val()) ;
      });

Example:

http://jsfiddle.net/3Tt7N/10/

answered Mar 20 '12 at 15:36

MCSI

2,818
26
35

Automatically sets second select field value

3 Answers3