選中復選框的行表中的表單中沒有復選框數據

Question

在表格中，每一行都包含一個獨特形式的復選框，如下所示：

<td class="d-inline-block col-2">
        <div class="form-check">
          <form action="/slider-update/1" method="post" id="check-1">
            <input type="hidden" name="csrfmiddlewaretoken" value="uDIiSPShbE3R2COQDI0qE4SlJGiqsQy8CQ2nQ0jllibaOqH6YsU8TtL7Xy0pF8sI">
            <input class="form-check-input position-static" type="checkbox" id="1" value="is_active" aria-label="...">
          </form>
        </div>
 </td>

每個表單都帶有一個以pk格式格式化的ID（此處為“ check-1”）。 盡管有所有這些明確的信息，但我無法獲得表格！

這是我的JavaScript代碼：

    $(document).on('click', 'form', function () {
      var rpk = $(this).attr("id");
      var url = $(this).attr("action");
      var form = $('#' + rpk);
      $.post(url, form.serializeArray())
          .done(function (data) {
              alert( data );
          });
  }); 

我得到了正確的表格，但它只包含令牌，與復選框沒有任何關系。

Answer 1

您需要將name屬性設置為您的復選框。 jQuery文檔在這里serializeArray

這將更改您的代碼，如下所示：

 <input class="form-check-input position-static" type="checkbox" id="1" name= "checkbox-1" value="is_active" aria-label="...">

也在您的JavaScript代碼中。 不需要做

var form = $('#' + rpk);

你可以用

$(this).serializeArray()

那是 ：

    $(document).on('click', 'form', function () {
      var url = $(this).attr("action");
      $.post(url, $(this).serializeArray())
          .done(function (data) {
              alert( data );
          });
  });