在 jquery 数据表中提交表单答案

【问题标题】：Submitting form in the jquery datatable在 jquery 数据表中提交表单
【发布时间】：2021-12-15 22:35:44
【问题描述】：

我在 jquery 数据表中有一些表单复选框输入。当我提交表单时，只会提交当前页面内的输入。请看一下这段代码：

<form action="update.php" method="POST" role="form">
 <table id="sampleTable">
  <thead>
    <tr>
      <th style="width: 50%;"> first </th>
      <th style="width: 50%;"> second </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><input type="checkbox" name="first[]" value="first" checked/>first</td>
      <td><input type="checkbox" name="second[]" value="second"/>second</td>
    </tr>
    <tr>
      <td><input type="checkbox" name="first[]" value="first" checked/>first</td>
      <td><input type="checkbox" name="second[]" value="second"/>second</td>
    </tr>
    <tr>
      <td><input type="checkbox" name="first[]" value="first" checked/>first</td>
      <td><input type="checkbox" name="second[]" value="second"/>second</td>
    </tr>
    <tr>
      <td><input type="checkbox" name="first[]" value="first" checked/>first</td>
      <td><input type="checkbox" name="second[]" value="second"/>second</td>
    </tr>
    <tr>
      <td><input type="checkbox" name="first[]" value="first" checked/>first</td>
      <td><input type="checkbox" name="second[]" value="second"/>second</td>
    </tr>
    <tr>
      <td><input type="checkbox" name="first[]" value="first" checked/>first</td>
      <td><input type="checkbox" name="second[]" value="second"/>second</td>
    </tr>
    <tr>
      <td><input type="checkbox" name="first[]" value="first" checked/>first</td>
      <td><input type="checkbox" name="second[]" value="second"/>second</td>
    </tr>
    <tr>
      <td><input type="checkbox" name="first[]" value="first" checked/>first</td>
      <td><input type="checkbox" name="second[]" value="second"/>second</td>
    </tr>
  </tbody>
  </table>
 <button type="submit" id="submit-btn">send</button>
 </form>



var table = $('#sampleTable').DataTable({
"pageLength": 2
});

$('#submit-btn').on('click', function(e){
e.preventDefault();
alert($('form').serialize());
});

https://jsfiddle.net/rodinmehr/ba8d1s57/7/

如您所见，尽管有更多已检查的输入，但只有两个已检查的输入会被提交。我的假设是 datatable 会禁用其他页面，因此它也会影响输入。你知道可能是什么问题，我该如何解决这个问题？任何建议将不胜感激:)

【问题讨论】：

标签： javascript jquery datatables

【解决方案1】：

我为此找到了一个非常简单的解决方案（可能不是最好的，但它有效！）。当您要提交表单时，只需像这样销毁 jquery 数据表：

$('#submit-btn').on('click', function(e){
   table.destroy();
});

在此之后，您的表单将在没有数据表的情况下提交，因此您将拥有所有输入。

【讨论】：