jQuery 데이터 테이블을 파괴 할 수 없습니다.

Question

JQuery 데이터 테이블을 파괴하는 데 문제가 있습니다. 내가 그것을 파괴하려고 곳

다음

$(document).ready(function() { 
    var table = $(".dynamic-wide-table").DataTable({ 
     "aaSorting": [], 
     "scrollX": true, 
     "scrollY": 530, 
     "scrollCollapse": true, 
     "lengthMenu": [ 
      [100, 400, 1000, 5000, -1], 
      [100, 400, 1000, 5000, "All"] 
     ], 
     "retrieve": true 
    }); 
}); 

은 다음과 같습니다 :

는

Uncaught TypeError: table.destroy is not a function 
Uncaught TypeError: table[0].destroy is not a function 

은 사람이 무엇을 알고 있습니까 : 여기

$(document).ready(function() { // Note that my page has two tables on it! 
    table.destroy(); 
    table[0].destroy(); 
});  // Trying to delete both tables first, then just the first table 

내 오류가 있습니다 내가 그것을 초기화 곳에있다

입니다 계속 해! 나는 매우 혼란 스럽다.

편집 : 여기

내가 table을 CONSOLE.LOG 때 발생의 이미지입니다.

Answer 1

각() 루프 테이블을 인스턴스화 및 배열에 저장 :

$(document).ready(function() { 
     var tables = []; 

    $("table").each(function(i){ 
    var table = $(this).DataTable({ 
     "aaSorting": [], 
     "scrollX": true, 
     "scrollY": 530, 
     "scrollCollapse": true, 
     "lengthMenu": [ 
      [100, 400, 1000, 5000, -1], 
      [100, 400, 1000, 5000, "All"] 
     ], 
     "retrieve": true 
    }); 
    tables.push(table); 
    }); 

    $('#button').click(function() { 
     // Then you can call destroy on that object 
     var elem = tables[0].table().node(); 
     tables[0].destroy(); 
     // And empty the element 
     $(elem).empty() 
    }); 
}); 

링크

Answer 2

jsFiddle에 당신은 모두 만들 수 없습니다 및 DataTable을 파괴 $(document).ready() 내에서 해당 이벤트가 동시에 트리거되기 때문입니다. @ CMedina의 JSfiddle에서 버튼 클릭과 같이 트리거되었을 때 작동하는 것을 볼 수 있습니다. (이들은 동일한 파일에 있다고 가정합니다)이 부분을 무시하십시오. 분명히 그들은 서로 다른 파일입니다.

작성/파괴가 다른 파일에 있다는 의견에 유의하십시오. 그게 사실이라면, 파괴 파일은 table을 어떻게 알 수 있습니까? DataTable (해당 페이지에 스크립트 파일을 포함하지 않아도 발생할 수 있음)을 인식하지 못하면 destroy()이 무엇인지 모르고 오류가 발생합니다.

편집 : 난 그냥 당신이 table[0]에 다음 table에 destroy()를 사용하려고하고 있습니다 것으로 나타났습니다. table을 DataTable 및 DataTable의 배열로 가질 수 없습니다. 배열에서 테이블을 고유하게 또는 둘 다 명명 해보십시오. 하나

var table; 
table[0] = $('#example').DataTable(); 
table[1] = $('#example2').DataTable(); 

또는 (아마 더 나은)

var table1 = $('#example').DataTable(); 
var table2 = $('#example').DataTable(); 

Answer 3

나는 당신이 당신의 페이지에 2 datatables을 가지고 있다고 가정하고 initializacion 클래스 .dinamyc-wide-table 모든 테이블입니다.

하나의 테이블 만 삭제하려면 페이지에있는 모든 데이터 테이블을 tables 기능으로 가져와야합니다.

그런 다음 지정된 테이블에 destroy를 적용하십시오. (예제에서는 2 개의 datatables로 작업합니다).

$(document).ready(function() { 
var table = $(".dynamic-wide-table").DataTable({ 
    "aaSorting": [], 
    "scrollX": true, 
    "scrollY": 530, 
    "scrollCollapse": true, 
    "lengthMenu": [ 
     [100, 400, 1000, 5000, -1], 
     [100, 400, 1000, 5000, "All"] 
    ], 
    "retrieve": true 
}); 


$('#destroy1').click(function() { 
    var dt1 = $.fn.dataTable.tables()[0]; 
    $(dt1).DataTable().destroy(); 
}); 

$('#destroy2').click(function() { 
var dt2 = $.fn.dataTable.tables()[1]; 
    $(dt2).DataTable().destroy(); 
}); 
}); 

결과 : 제대로 작동https://jsfiddle.net/cmedina/7kfmyw6x/80/