25

我正在使用 jquery 数据表在网格内显示数据。在初始化页面加载脚本上使用 DateTime.Today 并进一步处理它们，问题是在初始化页面加载之后，当我试图让用户输入日期以进行进一步处理时。我有以下错误。

DataTables 警告（表 id = 'dataTable'）：无法重新初始化 DataTable。要检索此表的 DataTables 对象，请不传递任何参数或查看 bRetrieve 和 bDestroy 的文档

function getDate() {
    var date = $('input[name="myDate"]').val();
    return date;
}

$('#myDate').click(updateDate);

function updateDate() { 
    $('#dataTable').dataTable({
        "bServerSide": true,
        "sAjaxSource": "/Home/Ajax",
        "fnServerParams": function (aoData) {
            var date = getDate();
            aoData.push({ "name": "myDate", "value": date });
        },
        //... there's more
}

updateDate();

脚本放在页面底部。

4

9 回答 9

57

尝试将 "bDestroy": true 添加到选项对象文字中，例如

$('#dataTable').dataTable({
    "bServerSide": true,
    ....
    "bDestroy": true
});
于 2012-09-17T07:05:54.883 回答
13

我知道这是一个老问题。但这适用于其他有类似问题的人。

您应该销毁旧的 dataTable 分配。在创建新数据表之前使用以下代码

$("#dataTable").dataTable().fnDestroy();
于 2014-01-14T00:21:16.000 回答
12

DataTables API 已更改，但如果您再次尝试重新初始化数据表，仍会引发此错误。

您可以检查它是否已经创建：

$.fn.DataTable.isDataTable("#myTable")

并销毁它以便可以再次重新创建它：

$('#myTable').DataTable().clear().destroy();

这不是最有效的方法，但它确实有效。应该可以在不首先破坏表的情况下更新表，只需使用clearand row.add，但是当数据源是传递给构造函数的数组时，我还没有找到一种方法。

于 2014-07-08T12:40:25.783 回答
3

The first thing you wanna do is to clean and destroy your datatables.

var tables = $.fn.dataTable.fnTables(true);

$(tables).each(function () {
  $(this).dataTable().fnClearTable();
  $(this).dataTable().fnDestroy();
});

and then re-create.

$("#datagrid").dataTable();
于 2014-01-29T17:52:25.023 回答
1

检查您的代码中是否有对数据表的重复调用。如果你不小心多次初始化你的表，它会返回这个错误

于 2013-09-17T21:42:39.253 回答
0

新的 Datatables API 有一个 reload 函数，它将再次从 ajax 源中获取数据，而无需您先销毁表。当我有一个包含大量行（5000+）的表时，销毁所需的时间比初始加载时间长，而且销毁时“处理”框不会出现，但是重新加载非常快并且正确显示“处理" 工作时的盒子。

这是问题中代码的更新版本，它使用新的 API 来达到预期的效果：

function getDate() {
  var date = $('input[name="myDate"]').val();
  return date;
}

$('#myDate').click(updateDate);

// Use .DataTable instead of .dataTable
// It returns a different object that has the ajax attribute on it.
var myDataTable = $('#dataTable').DataTable({
  "bServerSide": true,
  "sAjaxSource": "/Home/Ajax",
  "fnServerParams": function (aoData) {
    var date = getDate();
    aoData.push({ "name": "myDate", "value": date });
  },
  //... there's more

function updateDate() { 
  myDataTable.ajax.reload();
}

我所做的唯一更改是使用.DataTable而不是.dataTable并维护对返回值的引用，myDataTable以便可以使用它来调用.ajax.reload().

于 2014-10-03T14:50:32.070 回答
0

这对我有用 var table = $('#table1').DataTable({ destroy: true, responsive: true, ..... });

于 2019-07-11T11:47:53.267 回答
-1

清除现有数据表：

$(this).dataTable().fnClearTable();
$(this).dataTable().fnDestroy();
于 2016-02-15T10:19:11.987 回答
-2 
var myDataTable = $('#dataTable').DataTable();
myDataTable.ajax.reload();

绝对这就是我正在寻找的。重新初始化数据表的好解决方案

于 2016-10-18T10:25:40.310 回答