По крайней мере, один вариант выбран из одной из двух групп выбора

Question

У меня есть два раскрывающихся списка.Один для взрослых и один для детей.Я пытаюсь проверить форму, и мне нужно проверить, выбран ли хотя бы один параметр из одного из селекторов.

PHP

<select id="adults" class="custom-select attend" required>
    <option value="" selected>0</option>';

for($i=1; $i<=10; $i++) {
    echo '
    <option value='.$i.'>'.$i.'</option>';
}

echo '
</select>

<select id="adults" class="custom-select attend" required>
    <option value="" selected>0</option>';

for($i=1; $i<=10; $i++) {
    echo '
    <option value='.$i.'>'.$i.'</option>';
}

echo '
</select>

jQuery

$(document).on("click", "#submit-button", function() {
    var atnd = $(".attend");

    if (atnd.val().length == 0) {
         atnd.addClass("is-invalid");
    } else {
        atnd.removeClass("is-invalid");
    }
});

$(document).on("change", ".attend", function() {        
    var ths = $(this);        
    if (ths.val() != "") {
        $(".attend").not(ths).removeAttr("required").removeClass("is-invalid"); 
    }
});

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

Есть ли лучший способ?

Answer 1

Ну, вы можете проверить выбранный пункт таким образом

var selectedAdults = $("#adults option:selected").val();
if(selectedAdults !== "") {
    // You've selected a value
}
else {
    // You haven't selected anything
}

Answer 2

Первый элемент 'Id' не должен быть таким же.оба раскрывающихся списка имеют одинаковый «Id = взрослый» чек ниже кода

  <select id="adults" class="custom-select attend" required>
        <option value="" selected>0</option>';

    for($i=1; $i<=10; $i++) {
        echo '
        <option value='.$i.'>'.$i.'</option>';
    }

    echo '
    </select>

    <select id="childrens" class="custom-select attend" required>
        <option value="" selected>0</option>';

    for($i=1; $i<=10; $i++) {
        echo '
        <option value='.$i.'>'.$i.'</option>';
    }

    echo '
    </select>

   var Adults = $("#adults).val();
   var childrens = $("#childrens).val();
   if(Adults  != "" || childrens !="") {
       //Case 1 Selected atleast one value
     }
     else {
      // case 2
    }