Флажки Auto check на основе поля выбора

Question

У меня есть рабочий код для проверки флажков , но он работает только в том случае, если первый флажок уже установлен. Ребята, может быть, у вас есть идея, почему?

HTML:

<p id="ullman_seats"><input class="choice" type="checkbox" name="option['option']" value="3000"> Ullman seats 
    <select id="select_ullman"> 
     <option value="1">1</option> 
     <option value="2">2</option> 
     <option value="3">3</option> 
     <option value="4">4</option> 
    </select> 
</p> 
<p id="ullman_seats_2"><input class="choice" type="checkbox" name="option['option']" value="3000"> Ullman seats</p> 
<p id="ullman_seats_3"><input class="choice" type="checkbox" name="option['option']" value="3000"> Ullman seats</p> 
<p id="ullman_seats_4"><input class="choice" type="checkbox" name="option['option']" value="3000"> Ullman seats</p> 

JQuery (безопасно, потому что он будет реализован в WordPress)

jQuery('#select_ullman').change(function() { 
     if (jQuery(this).val() == '2') { 
      jQuery('#ullman_seats input').attr('checked', true); 
      jQuery('#ullman_seats_2 input').attr('checked', true); 
     }if (jQuery(this).val() == '3') { 
      jQuery('#ullman_seats input').attr('checked', true); 
      jQuery('#ullman_seats_2 input').attr('checked', true); 
      jQuery('#ullman_seats_3 input').attr('checked', true); 
     }if (jQuery(this).val() == '4') { 
      jQuery('#ullman_seats input').attr('checked', true); 
      jQuery('#ullman_seats_2 input').attr('checked', true); 
      jQuery('#ullman_seats_3 input').attr('checked', true); 
      jQuery('#ullman_seats_4 input').attr('checked', true); 
     } 
    } 

Answer 1

Вы используете неправильный метод, вы можете изменить .attr('checked', true) к .prop('checked', true) и т.д., чтобы заставить его работать, но есть гораздо более простой способ сделать это

jQuery('#select_ullman').on('change', function() { 
    $('.ullman_seats input').prop('checked', function(i, prop) { 
     return i < this.value; 
    }.bind(this)); 
}).trigger('change'); 

FIDDLE

U se обратный вызов для prop() и сравнить индекс каждого элемента напрямую

Answer 2

Вы должны использовать .prop ('проверено', правда);

jQuery('#select_ullman').change(function() { 
     if (jQuery(this).val() == '2') { 
      jQuery('#ullman_seats input').prop('checked', true); 
      jQuery('#ullman_seats_2 input').prop('checked', true); 
     }if (jQuery(this).val() == '3') { 
      jQuery('#ullman_seats input').prop('checked', true); 
      jQuery('#ullman_seats_2 input').prop('checked', true); 
      jQuery('#ullman_seats_3 input').prop('checked', true); 
     }if (jQuery(this).val() == '4') { 
      jQuery('#ullman_seats input').prop('checked', true); 
      jQuery('#ullman_seats_2 input').prop('checked', true); 
      jQuery('#ullman_seats_3 input').prop('checked', true); 
      jQuery('#ullman_seats_4 input').prop('checked', true); 
     } } 

и для проверки установлен флажок

if ($('#id').is(':checked') == true) { 
      //Do something 
     } 
     else { 
      //Do something else 
     }