jquery - jquery将点击事件绑定到类？datatables ajax从标签中删除行

Question

我正在使用 Datatables 并且在一个有两列的表中，第二列有一个带有类 .deletecomp 的文本链接，当单击 ajax 从数据库中删除条目时，我无法刷新表。

我在 // Test delete tr 注释下方添加了代码，当我单击表中的任何 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 );
    });

});

这是删除数据库条目的 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
    });
});

我希望这有帮助！