無法在數據表的表單中按下提交按鈕

Question

使用數據表並且將表單放置在其中一行中時，無法按下提交按鈕，這意味着按下提交按鈕時沒有任何反應。 我檢查了數據表文件，發現包含以下代碼的文件 vendor.js：

let table1 = document.querySelector('#table1');
let dataTable = new simpleDatatables.DataTable(table1);

刪除此代碼時，提交按鈕運行良好，但數據表崩潰了。有沒有人遇到過這個問題或解決這個問題？ 我的代碼：

 <table class='table table-striped' id="table1" style="text-align:center; font-size:0.8em;"> <thead > <tr> <th style="text-align:center;">#</th> <th style="text-align:center;">Product name</th> <th style="text-align:center;">Price</th> <th style="text-align:center;">Edit</th> <th style="text-align:center;">Remove</th> </tr> </thead> <tbody> <tr> <td class="col-sm-5 col-md-5">1</td> <td class="col-sm-1 col-md-1" style="text-align: center"> Apple </td> <td class="col-sm-1 col-md-1 text-center">3$</td> <td class="col-sm-1 col-md-1 text-center"><form action="Product" method="post"><input class="form-control" step="1" min="1" max="1000" value="<?= $quantity_ordrs; ?>" type="number" name="qty" > <input type="hidden" name="order-id" value="1" > <button type="submit" class="btn btn-outline-primary" name=" update-item"><i class="fa fa-edit"></i>edit</button> </form></td> <td class="col-sm-2 col-md-2 " > <form action="Order?kkk" method="post"><input class="form-control" step="1" min="1" max="1000" value="" type="number" name="qty" ><input type="hidden" name="order-id" value="1" > <button type="submit" class="btn btn-outline-primary" name="remove-item" ><i class="fa fa-trash"></i>remove</button> </form> </td> </tr></tbody></table>

Answer 1

某些東西阻止了默認的 onsubmit 事件。 您可以找到負責阻止提交的事件偵聽器，也可以創建新的偵聽器：

<button type="button" class="btn btn-outline-primary"  name="update-item"><i class="fa fa-edit"></i>edit</button>

$('[name="update-item"]').on('click', function() {
   $('#myForm').submit();
});