Question

以下是我的boostrap数据表staff_look。它在页面加载时包含大约50条记录。

$(document).ready(function () {
            $('#staff_look').DataTable({
                'ordering': true,
                'lengthMenu': [10, 25, 50, 75, 100]
            });
        });

单击按钮时，我删除所有行并将新行追加到表体。

$.post("<?php echo base_url('controller/function') ?>", {'id': id},
    function (data)
    {
        if (data.length > 0) {
            $('#tbl_body').find('tr').remove();
            for (j = 0; j < data.length; j++) {
                $('#tbl_body').append("<tr><td>" + (j + 1) + "</td><td>" + data[j]['reg_no'] + "</td><td>" + data[j]['first_name'] + " " + data[j]['last_name'] + "</td><td>" + data[j]['nic_no'] + "</td></tr>");
            }
        }
    },
    "json"
    );

但显示50个条目中的1到10个以及数据表中的下一个和上一个部分的表格在删除行并追加行时会发生变化。请帮我解决这个问题。

Answer 1

您可以考虑以下示例

删除行

$('#staff_look').DataTable().remove().draw( false );

添加新行

$('#example').DataTable().row.add( [
            (j + 1),
            data[j]['reg_no'],
            data[j]['first_name'],
            data[j]['last_name'],
            data[j]['nic_no'] 
        ] ).draw( false );

数据表未正确更新

1 个答案: