如何使用ajax将表中的所有数据插入数据库

Question

以下是我的代码以及我目前所做的。

点击#orderSave按钮后如何使用ajax将表中的所有数据插入数据库？？

<table class="table table-sm table-striped table-hover" id="tbltrs">
    <thead>
        <tr>
            <th>Name</th>
            <th>Price</th>
            <th>Qty</th>
        </tr>
    </thead>
    <tbody id="tbodydata"></tbody>
</table>

<button type="button" id="orderSave" class="btn btn-sm btn-secondary">Process</button>

$("#code").bind('模糊按键',function(event){ event.preventDefault(); if (event.keyCode === 13 || event.type == '模糊') { var vals = $('#code').val(); $.ajax({ 类型：'POST', url: 'check.php', 缓存: false, dataType:"json", data:{code: vals}，成功：函数（数据）{如果（数据['ok']> 0）{ 变量数量 = 1; var elems = $('#tbltrs td').filter(function(){ return $.trim($(this).text()) === data['name']; }); 如果（elems.length）{ var qty = parseInt(elems.parent('tr').find('#qty').val()) + 1; elems.parent('tr').find('#qty').val(qty); } 别的 { var html = ''; html += ''; html += ''+数据['产品']+''; html += ''+数据['价格']+''; html += ''; $('#tbodydata').prepend(html); } } 其他 {alert('none');} $('#code').val('').focus(); }, 错误：函数（错误）{警报（“错误”+JSON.stringify（错误））； } }); } });

$('#orderSave').click(function() {
$.ajax({
type: 'POST',
url: 'orders.php',
cache: false,
data:............,
success: function(data) {
printWindow = window.open("", "", "height=1, width=1");
printWindow.document.write(data);
printWindow.focus();
printWindow.print();
printWindow.close();
},
error:function(err){alert("error"+JSON.stringify(err)); }
});
});

Answer 1

需要序列化表单并使用提交事件 我们使用e.preventDefault() 不提交

你确实需要 NAME 属性

另外我建议在追加/前置数据时不要使用 ID

您忘记了使用 document.write 的 document.close

最后，当您使用模板文字时，html 更具可读性

$('#tbodydata').prepend(`<tr>
<td class="d-none"><input type="text" name="id" id="id" value="${data['id']}"></td>
<td class="col" name="product">${data(product)}</td>
<td class="col" name="price">${data(price)}</td>
<td class="col"><input type="text" name="qty" id="qty" value="${qty}"></td></tr>`);

$("#yourForm").on("submit",function(e) {
  e.preventDefault()
  const data = $(this).serialize();
  $.ajax({
    type: 'POST',
    url: 'orders.php',
    cache: false,
    data: data,
    success: function(data) {
      printWindow = window.open("", "", "height=1, width=1");
      printWindow.document.write(data);
      printWindow.document.close();
      printWindow.focus();
      printWindow.print();
      printWindow.close();
    },
    error: function(err) {
      alert("error" + JSON.stringify(err));
    }
  });
});