如何刷新数据表答案

【问题标题】：How to refresh DataTables如何刷新数据表
【发布时间】：2012-03-12 20:45:02
【问题描述】：

我正在使用 DataTables 插件使我的表格具有交互性。

该表格由 PHP 在页面上回显。

当我向数据库添加记录时，我正在使用 jQuery load() 加载表，但这会破坏 DataTables。

如何在保持 DataTables 完整的同时更新表格？

注意：我使用 DOM 作为数据源，而不是服务器端处理。

【问题讨论】：

你能发布你用来设置数据表的javascript代码吗？
$('#new').dataTable({ "iDisplayLength": 5, "sPaginationType": "full_numbers" });
我用这个来创建我的表 'var lol = $('#new').dataTable({ "iDisplayLength": 5, "sPaginationType": "full_numbers", "bDestroy": true });'然后这在我的另一个函数中 lol.fnDestroy();大声笑=空； $("#p").load("table.php"); $lol = $('#new').dataTable({ "iDisplayLength": 5, "sPaginationType": "full_numbers", "bDestroy": true });但是还是不行
答案取决于您正在加载的内容...更新时刷新整个表或仅刷新行

标签： jquery datatables

【解决方案1】：

如果要完全重新加载整个表，请将您的初始数据表初始化代码包装在一个函数中。在页面加载时调用该函数。当用 ajax 完全替换表时，您可能应该删除由插件创建的表父 div，作为它创建的所有非表 DOm 元素的包装器。如果 table ID="example" ，wrapper id="example_wrapper"。

这里有足够多的代码可能会让您顺利上路。有一些简单的方法可以只更新行，但由于请求是为了重新加载完整的表，所以我遵循了这一点

function initDataTables(){
    $('#myTable').datatables({/* put all current options here*/})

}


/* within ready event of pageload */

$(function(){
    initDataTables();
    /* all other page load code*/

});

/* use $.get to reload table */

$.get( tableUpdateUrl, data, function( returnData){

    $('#myTable').parent().replaceWith(returnData);

    /* re-initalize plugin*/

    initDataTables();
});

【讨论】：

这是页面上不必要的大量额外负载。 DataTables 提供了向数据集添加新行的方法。
“DataTables 提供了向数据集中添加新行的方法”与完全重新加载不同。如果你只是调用 addRows(data)，你不会复制数据吗？

【解决方案2】：

创建数据表时，将结果值分配给变量：

var table = $(".something").dataTable();

当您可能通过 AJAX 创建新项目时，请确保返回您的表格需要显示的属性。然后，在您的success 函数中，您可以使用fnAddData 方法向表中添加新行。此方法接受一个值数组，第一个在第一列，第二个在第二列，依此类推：

success: function(response){
    table.fnAddData([
        response.id,
        response.name,
        response.description,
    ]);
}

您可以阅读有关fnAddData 方法here 的更多信息。

【讨论】：

【解决方案3】：

您应该能够使用 ajax 插件。 http://datatables.net/plug-ins/api

【讨论】：