Charles_R Charles_R - 6 months ago 161
jQuery Question

JQuery - Change selected option of select when another select changed

I want to change the selected option of select menu when another select menus changed but i can't. This is my code:

$('#select_menu_1').on('change',function(){
$('#select_menu_2').val(2).trigger('change');
});


This code doesn't work and my problem is
select_menu_2
doesn't changing when i change the
select_menu_1
. How can i do this work?

Answer

Use this code

$("#dropdown1").change(function() {
    var value = $("option:selected", this).val();
    $("#dropdown2 > option[value=" + value + "]").attr("selected", true);  
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="dropdown1">
    <option value="Option-1">Option-1</option>
    <option value="Option-2">Option-2</option>
    <option value="Option-3">Option-3</option>
</select>
<select id="dropdown2">
    <option value="Option-1">Option-1</option>
    <option value="Option-2">Option-2</option>
    <option value="Option-3">Option-3</option>
</select>