Question

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

DataTables警告（table 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();

脚本放在页面底部。

Answer 1

尝试将“bDestroy”：true添加到选项对象文字中，例如

$('#dataTable').dataTable({
    "bServerSide": true,
    ....
    "bDestroy": true
});

Answer 2

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

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

$("#dataTable").dataTable().fnDestroy();

Answer 3

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

您可以使用以下命令检查是否已创建：

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

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

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

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

Answer 4

您要做的第一件事就是清理和销毁您的数据表。

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

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

然后重新创建。

$("#datagrid").dataTable();

Answer 5

检查代码中是否存在对数据表的重复调用。如果您不小心多次初始化表，则会返回此错误

Answer 6

新的Datatables API具有重新加载功能，可以再次从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的引用，以便可以用它来调用{{1} }}

Answer 7

这对我有用 var table = $（'＃table1'）。DataTable（{ 销毁：是的，响应式的：是的， ..... }）;

Answer 8

清除现有的dataTable：

$(this).dataTable().fnClearTable();
$(this).dataTable().fnDestroy();

Answer 9

var myDataTable = $('#dataTable').DataTable();
myDataTable.ajax.reload();

这绝对是我正在寻找的.Nice解决方案来重新定位数据表

无法重新初始化JQuery DataTable

9 个答案: