Включить / отключить кнопку отправки, когда установлен любой / нет флажок в форме

Я пытаюсь использовать jQuery для динамического включения / отключения кнопки отправки для формы.

HTML:

<form id="user-add-to-group">
  <table class="group-list">
    <tbody>
      <tr>
        <th>Voornaam</th>
        <th>Achternaam</th>
        <th>S/P-nummer</th>
        <th>Email</th>
        <th>Type</th>
      </tr>
      <tr>   
        <td>Name</td>
        <td>Surname</td>
        <td>No.</td>
        <td>[email protected]</td>
        <td>student</td>
        <td><input type="checkbox" name="user_add_to_group[]" value="75F0CE8F-4B6F-4E17-BC7B-0B06AAD84625"></td>
      </tr>
    </tbody>
  </table>
  <button disabled="disabled" type="button" id="participant_add_btn" name="participant_add_btn" class="btn btn-primary">Add</button>                            
</form>

И JQuery:

$('table.group-list tr').on("click", function(){
  $(this).find("input[type=checkbox]").trigger('click');
    if($("#user-add-to-group input[type=checkbox]:checked").length>0){
      $("#participant_add_btn").prop("disabled","false");
    }
    else {
      $("#participant_add_btn").prop("disabled","disabled");
    }
});

Я хочу сделать всю строку таблицы активируемой, поэтому jQuery вызывает событие click при нажатии на tr. Это работает, но я не могу понять, почему моя кнопка не будет активирована впоследствии. Я хочу включить его, когда установлен любой флажок в форме, и отключить его, если ни один из них не установлен.

Если нужна дополнительная информация, пожалуйста, дайте мне знать.

Ответы на вопрос(3)

Вам нужно передать логический аргумент вместо строки при установке значения свойства.

$('#participant_add_btn').prop('disabled', false);

или использовать.removeAttr("disabled")

$('#participant_add_btn').removeAttr("disabled");

Ваш код не будет работать при нажатии флажка. Для этого вам нужно проверить цель элемента clicked, если он уже установлен, не вызывать событие click для него:

Рабочий фрагмент:

$('table.group-list tr').on("click", function(e){
  if($(e.target).is(':not(:checkbox)'))
   $(this).find("input[type=checkbox]").trigger('click');
   $("#participant_add_btn").prop("disabled",$("#user-add-to-group input[type=checkbox]:checked").length == 0);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="user-add-to-group">
  <table class="group-list">
    <tbody>
      <tr>
        <th>Voornaam</th>
        <th>Achternaam</th>
        <th>S/P-nummer</th>
        <th>Email</th>
        <th>Type</th>
      </tr>
      <tr>   
        <td>Name</td>
        <td>Surname</td>
        <td>No.</td>
        <td>[email protected]</td>
        <td>student</td>
        <td><input type="checkbox" name="user_add_to_group[]" value="75F0CE8F-4B6F-4E17-BC7B-0B06AAD84625"></td>
      </tr>
    </tbody>
  </table>
  <button disabled="disabled" type="button" id="participant_add_btn" name="participant_add_btn" class="btn btn-primary">Add</button>                            
</form>

 Rayon19 июл. 2016 г., 11:55
Играть сBoolean(true) вместо"disabled"
Решение Вопроса

jQuery.prop ожидает, что значение будетBoolean, любойstring что не пусто, считаетсяtrue как это истинная ценность

$('table.group-list tr').on("click", function() {
  $(this).find("input[type=checkbox]").trigger('click');
  $("#participant_add_btn").prop("disabled", !$("#user-add-to-group input[type=checkbox]:checked").length);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form id="user-add-to-group">
  <table class="group-list">
    <tbody>
      <tr>
        <th>Voornaam</th>
        <th>Achternaam</th>
        <th>S/P-nummer</th>
        <th>Email</th>
        <th>Type</th>
      </tr>
      <tr>
        <td>Name</td>
        <td>Surname</td>
        <td>No.</td>
        <td>[email protected]</td>
        <td>student</td>
        <td>
          <input type="checkbox" name="user_add_to_group[]" value="75F0CE8F-4B6F-4E17-BC7B-0B06AAD84625">
        </td>
      </tr>
    </tbody>
  </table>
  <button disabled="disabled" type="button" id="participant_add_btn" name="participant_add_btn" class="btn btn-primary">Add</button>
</form>

 Rayon19 июл. 2016 г., 12:05
@LennartKloppenburg Рад помочь!
 lennyklb19 июл. 2016 г., 12:03
Принято для наиболее эффективного кода. Элегантный. Спасибо!
$('#toggle').click(function () {
//check if checkbox is checked
if ($(this).is(':checked')) {

    $('#sendNewSms').removeAttr('disabled'); //enable input

} else {
    $('#sendNewSms').attr('disabled', true); //disable input
}

Проверьте здесь.

Ваш ответ на вопрос