выбрать значение по умолчанию в первом раскрывающемся списке, когда я нажимаю на второй

Question

у меня есть два выпадающих списка, я хочу onclick или onchange от одного, второй установить значение по умолчанию и наоборот

//first dropdown   
 @Html.DropDownList("Agent_Id", null, "Séléctionnez un élément", htmlAttributes: new { @class = "form-control select2 unselected", required = "Séléctionnez un élément" }) 

   // second drop down
 @Html.DropDownList("TypeEntite_Id", null, "Séléctionnez un élément", htmlAttributes: new { @class = "form-control select2 unselected", required = "Séléctionnez un élément" }) 

Я попытался использовать код jquery для решения этой проблемы, но я не мог понять,правильный путь

        $('.unselected').change(function () {


            $(this).addClass('selected');

            if ($('.unselected').hasClass('selected')) {
                $('.unselected').removeClass('selected');
                $(this).addClass('selected');
            }

            if ($(this).hasClass('selected') )
            {
                $('.unselected').not(this).each(function () {
                    $('.unselected').val("");
                });

            }

Answer 1

Можно упростить это до

var $selects = $('select.select2').change(function() {  
  $selects.not(this).val('');
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="select2">
  <option value="">-- Choose something --</option>
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>

<select class="select2">
  <option value="">-- Choose something --</option>
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>

Answer 2

Попробуйте это:

// hook to select change
$('.form-control.select2').change(function() {

    // remove unselected and add selected css class
    $(this).toggleClass('selected unselected');

    // unselect all other .unselected values
    $('.form-control.select').not($(this)).removeClass('selected').addClass('unselected').val('');

});