ajax jquery 在 laravel blade 中成功完成后重置 table 行
Reset table row after successful ajax jquery done in laravel blade
我的 laravel 项目中有一个采购到期清单 table。单击购买 ID 时,我想使用 Ajax 请求在模态 table 中显示购买详细信息,并在成功显示结果后想要自动重置模态 table。但是在我的代码中,模态 table 不会自动重置,尽管我使用的是 $('#datatable').reset();
.
模态 Table
<table id="datatable" class="display compact table table-bordered">
<thead class="thead-light">
<tr>
<th>Item Name</th>
<th>Qty</th>
<th>Unit Price</th>
<th>Total Amount</th>
</tr>
</thead>
<tbody id="item-tbody">
</tbody>
Ajax
$(".purchase_invoice").click(function(event) {
var pi_id = $(this).attr('href');
var table = '';
$.ajax({
url: "{{ url('purchase-invoice-detail') }}" + "/" + pi_id,
type: "get",
success: function(response){
$.each( response, function( key, data ) {
$.each( data, function( key, value ) {
$(".pi_no").html(value['purchases_id']);
$(".pi_date").html(value['updated_at']);
table += '<tr>';
table += '<td>';
table += value['name'];
table += '</td>';
table += '<td>';
table += value['quantity'];
table += '</td>';
table += '<td>';
table += value['unit_price'];
table += '</td>';
table += '<td>';
table += value['total_amount'];
table += '</td>';
table += '</tr>';
});
});
table += '<tr>';
table += '<td colspan="3">Net Payable Amount:';
table += '</td>';
table += '<td colspan="1">';
table += response[0][0]['net_payable_amount'];
table += '</td>';
table += '</tr>';
$('#item-tbody').append(table);
$("#viewModal").modal('show');
$('#datatable').reset();
},
error: function(response){
alert('Error'+response);
}
});
});
问题出在哪里?有人帮忙吗?
也许你应该将 $('#datatable').reset();
更改为:
$('#item-tbody').html('');
或
document.getElementById("item-tbody").value = "";
我的 laravel 项目中有一个采购到期清单 table。单击购买 ID 时,我想使用 Ajax 请求在模态 table 中显示购买详细信息,并在成功显示结果后想要自动重置模态 table。但是在我的代码中,模态 table 不会自动重置,尽管我使用的是 $('#datatable').reset();
.
模态 Table
<table id="datatable" class="display compact table table-bordered">
<thead class="thead-light">
<tr>
<th>Item Name</th>
<th>Qty</th>
<th>Unit Price</th>
<th>Total Amount</th>
</tr>
</thead>
<tbody id="item-tbody">
</tbody>
Ajax
$(".purchase_invoice").click(function(event) {
var pi_id = $(this).attr('href');
var table = '';
$.ajax({
url: "{{ url('purchase-invoice-detail') }}" + "/" + pi_id,
type: "get",
success: function(response){
$.each( response, function( key, data ) {
$.each( data, function( key, value ) {
$(".pi_no").html(value['purchases_id']);
$(".pi_date").html(value['updated_at']);
table += '<tr>';
table += '<td>';
table += value['name'];
table += '</td>';
table += '<td>';
table += value['quantity'];
table += '</td>';
table += '<td>';
table += value['unit_price'];
table += '</td>';
table += '<td>';
table += value['total_amount'];
table += '</td>';
table += '</tr>';
});
});
table += '<tr>';
table += '<td colspan="3">Net Payable Amount:';
table += '</td>';
table += '<td colspan="1">';
table += response[0][0]['net_payable_amount'];
table += '</td>';
table += '</tr>';
$('#item-tbody').append(table);
$("#viewModal").modal('show');
$('#datatable').reset();
},
error: function(response){
alert('Error'+response);
}
});
});
问题出在哪里?有人帮忙吗?
也许你应该将 $('#datatable').reset();
更改为:
$('#item-tbody').html('');
或
document.getElementById("item-tbody").value = "";