Question

如何使该复选框选中当前结果元素中的所有复选框？因为点击atm就是选中所有结果元素中的所有框

//dynamic row
var filter_row = 0;
function addFilterRow() {
  html = '<tr id="filter-row">';
  html += '  <td class="text-left">';
  html += '  <select class="company" name="company[]" class="form-control">';
  html += '  {% for company in damask_company %}';
  html += '  <option name="{{ company.filter_group_id }}" value="{{ company.filter_group_id }}">{{ company.name }}</option>';
  html += '  {% endfor %}';
  html += '  </select>';
  html += '</td>';
// Ajax return here 
  html += '<td class="text-left" id="result"></td>';

  html += '</tr>';
  $('tbody').append(html);

  filter_row++;
}

$(document).on('change', 'select.company', function(e) {
    e.preventDefault();
    var $result = $(this).closest('tr').find('td.result');
    var id = $(this).val();
    var url = "index.php?route=catalog/product/getCat&user_token={{ user_token }}&filter_group_id=" + id;
    $.ajax({
      type: "GET",
      url: url,
      success: function(data) {

   // checkbox to check all
      $result.append($('<p class="text-danger"><input type="checkbox" class="checkAll"> Select All</p>'));

        $result.append(data);
      }
    });
});

我开枪检查所有方式

$(document).on('click', '.checkAll', function(){
        $('input:checkbox').not(this).prop('checked', this.checked);
    });

Answer 1

您可以将change事件监听器与is(":checked")一起使用，如下所示。

编辑：

对于单行，您可以使用closest并在该tr中找到复选框。

$(document).on('change', '.checkAll', function(){
   $(this).closest('tr').find("input:checkbox").prop('checked', $(this).is(":checked"));
});

Answer 2

您需要选择包装器，并在包装器中找到您的复选框

$(document).on('change', '.checkAll', function(){
  $(this).closest('tr').find(":checkbox").prop('checked',true);
});

这应选中tr复选框位于selectAll内的所有复选框

复选框全部选中动态元素

2 个答案: