使用新的API重新初始化数据表 [英] Reinitialize datatable using the new API

问题描述

我发现了一些关于使用旧API重新初始化数据表的SO线程，但是我认为它们现在已被弃用.

I've found some SO threads about reinitializing a datatable using the old API, but I think they're deprecated now.

我有一个现有的渲染数据表.我想用新设置刷新它.使用新的API，我将如何执行以下操作:

I have an existing rendered datatable. I would like to refresh it with new settings. Using the new API, how would I do the following:

var dataTable = $('table.dataTable').DataTable();

var newDataTableSettings = {
    data: { /* some data */ },
    columns: { /* some columns*/ },
    bFilter: false,
    // etc...
};

// something like dataTable.clear().data(newDataTableSettings).draw()

我最接近的尝试:

dataTable.clear().draw() 
dataTable.rows.add({ /* some data */ }).draw();

推荐答案

使用 destroy 选项:

$('#example').DataTable({
    data:  [{ test : 'test' }, { test : 'qwerty'}],    
    columns : [ { data : 'test', title: 'test' } ]    
});

使用新数据重新初始化并删除搜索功能.

reinitialise with new data and removed search capabilities .

$("#reinit").on('click', function() {
    $('#example').DataTable({
        destroy: true, //<--- here
        data: [{ newCol : '100010'}, { newCol : '234234'}],
        columns: [ { data : 'newCol', title: 'header' } ],
        searching: false
    })
});

http://jsfiddle.net/3sonfsfm/

如果您使用选项文字，则必须 在重新使用它之前将其重置:

If you use an options literal you must reset it before reusing it :

var options = {
    data:  [{ test : 'test' }, { test : 'qwerty'}],    
    columns : [ { data : 'test', title: 'test' } ]    
}

$("#reinit").on('click', function() {
    options = {}; //<--- RESET
    options.destroy = true;
    options.data = [{ newCol : '100010'}, { newCol : '234234'}];
    options.columns = [ { data : 'newCol', title: 'header' } ];
    options.searching = false;
    $('#example').DataTable(options).draw();
});

这是因为options对象富含诸如aaData，aoColumns等之类的不同值，如果您指定新的data和新的columns，则它们会冲突.

This is because the options object is enriched with different values such as aaData, aoColumns an so on, which will conflict if you specify new data and new columns.

这篇关于使用新的API重新初始化数据表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！