正確的重繪DataTable的方法？得到錯誤：「沒有方法‘fnDraw’」和「無法讀取屬性‘oFeatures’」

Question

我繼承了下面的代碼：

// Show/Hide table rows from checkboxes 
    $("table.data#report-table .warning").toggle($("#warning_checkbox").is(":checked")); 
    $("#warning_checkbox").click(function() { 
    $("table.data#report-table .warning").toggle($("#warning_checkbox").is(":checked")); 
    $('.data_table#report-table').dataTable().fnDraw(); 
    }); 

當ID warning_checkbox一個複選框被選中，則顯示/隱藏行（實際上，tbody元素）的table.data#report-table它們具有類.warning

據我所看到的，還有就是頁面上沒有'.data_table#report-table元素 - 所以我假設的東西難道不工作。然而 - 它（神奇？）確實如此，即表格被重新繪製，並保留其正確的設置。然而，我得到以下錯誤在Chrome控制檯：

Uncaught TypeError: Cannot read property 'oFeatures' of null 

，我想可能是因爲缺少的元素無論如何，我重寫了代碼的功能，因爲我（但當時它是如何仍然工作？）需要在其他地方重複使用它：

var checkbox_rows = function(checkbox_id, table_id, tbody_class) { 
    var checkbox = $('div.buttons input[id$='+checkbox_id+']'); 
    var table = $('table.data[id$='+table_id+']'); 

    checkbox.click(function() { 
     $('tbody[class$='+tbody_class+']', table).toggle(checkbox.is(':checked')); 
     table.fnDraw(); 
    }); 
    } 

    checkbox_rows('warning_checkbox', 'report-table', 'warning'); 

這也適用於（而且使我更有意義） - 但現在我在Chrome控制檯得到一個不同的錯誤：

Uncaught TypeError: Object [object Object] has no method 'fnDraw' 

所以我的問題是，什麼我在做什麼？翁？什麼是重繪DataTable的正確方法？

謝謝

Answer 1

在你修改後的代碼，你jQuery的$('table')對象—它沒有相關fnDraw()方法—而不是DataTable對象上調用fnDraw()。

你要調用fnDraw()對象您最初叫dataTable()上，如：

$(document).ready(function() { 
    var oTable = $('#yourDataTable').dataTable(); 
    oTable.fnDraw(); 
}); 

所以這是行不通的：

$(document).ready(function() { 
    var oTable = $('#yourDataTable'); 
    oTable.fnDraw(); // Won't work, because the dataTable() method wasn't called above 
}); 

如果您無法訪問原因是由於某種原因（很難說沒有看到更多代碼），您再次調用dataTable()，您可以嘗試通過調用dataTable()table來重新初始化表格，並可選擇傳入bDestroy或bRetrieve，這取決於你需要什麼。因此，像：

table.dataTable({ "bRetrieve": true }); 

（我真的不知道你是否會需要調用fnDraw()任何更多之後）