jquery는 클래스에 클릭 이벤트를 바인드합니까? datatables 아약스 태그에서 행을 삭제

Question

나는 Datatables를 사용하고 두 번째 열에는 클래스와 텍스트 링크가 있습니다 .deletecomp 클릭하면 아약스는 데이터베이스에서 항목을 삭제하지만 문제가 생겨요. 탁자.

아래에 코드를 추가했습니다. // Delete delete tr comment. 표에서 tr을 클릭하면 행이 삭제되고 표가 새로 고침됩니다. AJAX가 시작되고 db 테이블의 항목이 제거됩니다. 나는 .deletecomp 클래스가 내 삭제 텍스트 링크와 함께 작동하는이 기능을 변경할 수있는 방법

이것은 내가 테이블

oTableVC = $('#viewcomp').dataTable({ 
     "sDom":'t<"bottom"filp><"clear">', 
     "bAutoWidth": false, 
     "sPaginationType": "full_numbers", 
      "aoColumns": [ 
      null, 
      null 
      ] 
    } 
    ); 
    //Test delete tr 
    $("#viewcomp tbody tr").live('click', function() { 
     oTableVC.fnDeleteRow(this); 
    }); 

}); 

를 초기화하고 어떻게 그리고 이것은 DB 항목을 삭제합니다 AJAX입니다

$(".deletecomp").live('click', function(event){ 
    event.preventDefault(); 
    cidstring = $(this).attr("id"); 
    cidArr = cidstring.split("-"); 
    cid = cidArr[1]; 
    var url = 'http://domain.com/ajaxdeletecomp?format=json'; 

    $.post(url, { id: cid},function(ajaxdata) { 
     //deleting row from table 

     }); 
    }); 

Answer 1

이전에이 플러그인을 사용하지 않았습니다. 그러나 귀하의 코드를 기반으로 다음과 같은 트릭을해야합니다 :

// Needs to be declared in the the JS Document outside of any functions // 
var oTableVC = $('#viewcomp').dataTable({ 
    "sDom":'t<"bottom"filp><"clear">', 
    "bAutoWidth": false, 
    "sPaginationType": "full_numbers", 
    "aoColumns": [ 
     null, 
     null 
     ] 
    } 
); 


$(".deletecomp").live('click', function(event){ 
    event.preventDefault(); 
    cidstring = $(this).attr("id"); 
    cidArr = cidstring.split("-"); 
    cid = cidArr[1]; 
    var url = 'http://domain.com/ajaxdeletecomp?format=json'; 
    var $target = $(this).closest('tr'); // Add Reference </tr> of Link 

    $.post(url, { id: cid},function(ajaxdata) { 
     //deleting row from table 
     oTableVC.fnDeleteRow($target); // Deletes Row 
    }); 
}); 

이 도움이되기를 바랍니다.