使用 jQuery 提交带有复选框的 DataTable 表中的所有数据

Question

所以我有这个数据表[图。 1]在提交表格数据的表单中，问题是它没有提交所有页面中的所有检查行，它只提交显示的内容。 然后我找到了一种方法来修复“[图 2]上的代码”，但现在是的，它提交了来自其他页面的所有数据，但我怎么能喜欢 connect 并使用data-checkid 的值提交layer_box的值。

场景是将要提交的所有已检查行都将运行这样的查询
UPDATE table SET sub_group = **layer_box** WHERE id = **data-checkid's value**

[图。1]

<form method="POST" id="manage-layers" name="manage-layers">
    <button class="btn btn-warning" type="submit" id="save_layers">
        <i class="fa fa-save"></i>
        <strong>Save</strong>
    </button>
    <table id="subgrp_layertbl" class="table table-responsive text-dark">
        <thead class="thead-dark">
            <tr>
                <th scope="col">ID</th>
                <th scope="col">Layer Name</th>
                <th scope="col">Associate Layer</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td width="1%">1</td>
                <td width="50%">Value 1</td>
                <td width="30%">
                    <div class="text-center">
                        <input class="form-check-input layer_box" type="checkbox" name="layer_box"  value="12,27" data-checkid="40"  >
                    </div>
                </td>
            </tr>
            <tr>
                <td width="1%">3</td>
                <td width="50%">Value 3</td>
                <td width="30%">
                    <div class="text-center">
                        <input class="form-check-input layer_box" type="checkbox" name="layer_box"  value="14" data-checkid="3"  >
                    </div>
                </td>
            </tr>
            <tr>
                <td width="1%">8</td>
                <td width="50%">Value 8</td>
                <td width="30%">
                    <div class="text-center">
                        <input class="form-check-input layer_box" type="checkbox" name="layer_box"  value="16" data-checkid="8"  >
                    </div>
                </td>
            </tr>
        </tbody>
    </table>
</form>

[图2]

<script type="text/javascript">
 $(document).ready(function (){
    var table = $('#subgrp_layertbl').DataTable();
    $('#manage-layers').on('submit', function(e){
      e.preventDefault();
      var data = table.$('input,select,textarea').serializeArray();
      console.log(data);
    });      
  });
</script>

Answer 1

我真的认为这应该可以解决您的问题https://stackoverflow.com/a/59550389/10888948如果您有更多功能，只需添加其他功能。