ajax jquery 在 laravel blade 中成功完成后重置 table 行

Question

我的 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);
            }
        });
});

问题出在哪里？有人帮忙吗？

Answer 1

也许你应该将 $('#datatable').reset(); 更改为：

$('#item-tbody').html('');

或

document.getElementById("item-tbody").value = "";

ajax jquery 在 laravel blade 中成功完成后重置 table 行

Reset table row after successful ajax jquery done in laravel blade

php

jquery

ajax

laravel