DataTables

Question

나는 우리가 나는의 행을 추가 할 .materialTable 클래스가 테이블의 수는 2

입니다 가정 해 봅시다

/* Data Table Initialization */ 
var $materialDataTable = $('.materialTable').dataTable({ 
    "aoColumnDefs": [{ "sClass": "text-center", "aTargets": [ 0,9 ] }, 
      { 'bSortable': false, 'aTargets': [ 9 ] }] 
}); 

DataTables를 사용하는 여러 테이블이 특정 테이블.

$materialDataTable[0].fnAddData([ 
    '1', 
    '<a href="#" class="materialItem" data-type="text">N/A</a>', 
    'N/A', 
    'N/A', 
    'N/A', 
    '0', 
    '0', 
    '0', 
    '0', 
    '<input type="checkbox" class="deleteMaterialCheckBox">' ]); 

하지만이 작동하지 않습니다

나는이 시도. 그것은 Object #<HTMLTableElement> has no method 'fnAddData'

그것이 짧은 나는 버튼을을 클릭하면 특정 테이블에 행을 추가 할 수 있도록하기 위해하지만 위의 초기화에서 특정 테이블을 선택하는 방법을 모르겠어요 날이 오류를 제공합니다.

Answer 1

디버거가 Object #<HTMLTableElement> has no method 'fnAddData'이라고 말합니다. <HTMLTableElement>은 개체의 원시 HTML 만 보유하고 있기 때문입니다. jQuery 객체가 아니므로 메소드가 전혀 없습니다.

$(...)을 감싸면 jQuery 객체가되며 사용 가능한 모든 메서드와 속성에 액세스 할 수 있습니다.

console.log($materialDataTable[0]) 및 console.log($($materialDataTable[0])을 사용해 자신이 선택한 DevTool의 차이점을 확인하십시오. 문제의 해결책이 코멘트에서 언급 한 바와 같이

:

$($materialDataTable[0]).dataTable().fnAddData(...) 

편집

이 단순화 jsfiddle 참조하십시오. 때로는 설명하는 것이 좋지 않지만이 예는 귀하의 문제가 무엇인지 보여줍니다.