datatable的fnDestroy和fnClearTable的使用


datatable是jq的一個插件,具體的怎么使用以及各參數的作用官網都有,我就不說了。

當我們對一個table使用datatable初始化之后,我們改變了table的內容,然后想再次重新的對新的table進行初始化,那么我們該怎么做?

舉一個例子:

我使用backbone寫前端js代碼:

var app.dt = {

sDom: '<"row"><"pull-right search"f>rt' +
  '<"row"<"col-sm-12"<"pull-left"i>' +
  '<"pull-left"l><"pull-right"p><"clearfix">>>D',
'bProcessing': true,
'bSort': false,
'bRetrieve': true,
'bLengthChange': true,
'iDisplayLength': 10,
'aLengthMenu': [10, 15, 20, 30],
'bDestroy': true
};

var dttable = $('#example').datatable(app.dt);

初始化完成之后,我們得到了想要的效果,然后,我們往table里面加了一條記錄,也就是加了一個tr,然后再對此table進行datatable初始化會發現是不起作用的,那么我們的table就會變形,

本來按要求分頁好的記錄會一次性全部顯示在第一頁。

so 我的解決辦法是:

if ($('#example').hasClass('dataTable')) {
  dttable = $('#example').dataTable();
  dttable.fnClearTable(); //清空一下table
  dttable.fnDestroy(); //還原初始化了的datatable
}

//往$('#example')里面插入新的所有數據

if (app.xmCol.length !== 0) {
  app.xmCol.each(this.addOne, this);
}

$('#example').dataTable(app.dt);

這樣處理之后無論我們對table進行增還是刪,那么我們的datatable能正常顯示和分頁了。

純屬個人實踐經驗,如果你有其他方法,還望分享。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM