如何在jQuery中将数据追加到数据表？

Question

我一直试图将数据追加到jquery中的数据表，数据追加到数据表，但是数据表不能正常工作，这意味着排序，分页，搜索不起作用。 数据表中甚至有数据，但显示0条记录。 我正在尝试使所有功能正常工作，请为此提供帮助。

<table id="newexample1">
    <thead>
        <tr>
            <th>Name</th>
            <th>Employee</th>
            <th>InTime</th>
        </tr>
    </thead>
    <tbody class="tablebody">
    </tbody>
</table>
<script>
    function newfunction() {
        $(".tablebody").append("<tr onclick='historyfunction()'><td>Sasi Kumar</td><td>Suresh Kumar</td><td>21/06/2019 10:59:02</td></tr>");
    }
</script>
<script>
    $(document).ready(function() {
        $('#newexample1').DataTable();
    });
</script>

我期待一个正确的数据表。

Answer 1

function newfunction() {
        $(".tablebody").append("<tr onclick='historyfunction()'><td>Sasi Kumar</td><td>Suresh Kumar</td><td>21/06/2019 10:59:02</td></tr>");
        $(".tablebody").append("<tr onclick='historyfunction()'><td>omar omar</td><td>Suresh Kumar</td><td>21/06/2019 10:59:02</td></tr>");
    }

    $(document).ready(function() {
        newfunction();
        $('#newexample1').DataTable();
    });

这是一个工作的JSfiddle

在您的代码中，从不调用newfunction()因此当Datatable尝试呈现表时，该表为空。 在$(document).ready(function()实例化渲染数据表之前添加行（否则您将获得0行表）。否则，如果要在渲染数据表后添加行，请使用rows.add()然后重绘该表在屏幕上使用draw()函数。