如何使用 jQuery 使用 column() 访问 dataTables 中的列？

Question

我在 dataTable 中所做的是我有两个复选框，它们与我的列 (0) 和列 (6) 分开，我的代码正在为复选框工作以检查我的所有元素，但问题是我只能指定列（0）。如何访问带有复选框的数据表中的列 (6)？

这是我的代码示例。

$("#select_all").on('click', function() {
  $('#dataTables').DataTable()
    .column(0)<<<<<<<<<<<<<<<<<<< this is my problem, it only specifies 
     column(0)
    .nodes()
    .to$()
    .find('input[type="checkbox"]:enabled:visible')
    .prop('checked', this.checked);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row">
  <div class="col-lg-12">
    <div class="panel panel-default">
      <div class="panel-heading">
        Emailed Data for approval
      </div>
      <!-- /.panel-heading -->
      <div class="panel-body">
        <div class="table-responsive">

          <table width="100%" class="table table-striped table-bordered table-hover" id="dataTables">
            <thead>
              <tr>
                <th>
                  <center>
                    Select Data
                    <input type="checkbox" id="select_all">
                  </center>
                </th>
                <th> Control Number </th>
                <th> Tools Specification </th>
                <th> Supplier </th>
                <th>
                  <center> Status </center>
                </th>
                <th>
                  <center> Reason for transfer </center>
                </th>

                <th class="hide_me">
                  <center>
                    ####
                    <input name="chk_id[]" type="checkbox" class="subCheckbox" value="<?php echo $row['tools_req_id'];?>">
                  </center>
                </th>

              </tr>
            </thead>
            <td>
              <center>
                <input name="chk_status[]" class="is_checked_status" type="checkbox" value="<?php echo $row['req_stats'];?>">
              </center>
            </td>


            <td>
              <center>
                <label data-id="<?php echo $row['ID'];?>" class="statusButton <?php echo ($row['req_stats'])? 'label-success': 'label-danger'?>">
</label>
              </center>
            </td>

            <td>
              <center>
                <p>

                </p>
              </center>
            </td>




            </tbody>
          </table>

        </div>
      </div>
    </div>
  </div>
</div>

Answer 1

您可以使用columns() 代替column() - 并使用数组选择器指定要选择的索引：[ 0, 6 ]。

（其实selector options这样的selector options还有很多种，除了基本的索引整数，还有我的索引整数数组。）

这是我的代码版本：

$("#select_all").on('click', function() {
  var nodesObj = $('#dataTables').DataTable().columns( [ 0, 6 ] ).nodes().to$();
  var nodesArray = nodesObj[0].concat( nodesObj[1] );
  $(nodesArray).find('input[type="checkbox"]:enabled:visible').prop('checked', 'true');
});

在上面的代码中，columns( [ 0, 6 ] ) 函数返回一个包含 2 个数组的对象 - 每个选定列一个。

那么我们必须将它们合并到一个数组中：nodesObj[0].concat( nodesObj[1] )。

之后，我们可以将我们的 jQuery find 应用到生成的 jQuery 对象数组中。