jQuery数据表插件不删除表行

Question

I'm trying to figure out why when I click my delete button it changes performs the php side of things but when it gets back to the client side it doesn't delete the row from the table. I'm using datatables for my tables.

$('.delete').click(function() { 
    var titleID = $(this).attr('rel');
    $.post('titles/delete', { titleID:titleID }, function(data) {
        if (data.success)
        {
            var anSelected = fnGetSelected( oTable );
            oTable.fnDeleteRow( anSelected[0] );
        }
    });
});

The response from the php side is this:

{"success":"Yes","message":"Title was deleted successfully!"}

EDIT :

Here's what I'm using now and I'm getting an interesting error message that says fnGetSelected is not defined. So I'm not sure if I"m even doing this properly to delete a table row.

$('.delete').click(function() { 
var titleID = $(this).attr('rel');
$.post('titles/delete', { titleID:titleID }, function(data) {
    if (data.success)
    {
        var anSelected = fnGetSelected( oTable );
        oTable.fnDeleteRow( anSelected[0] );
    }
}, 'json');
});

Answer 1

oTable is an object found within the datatables functionality and is defined there within it. Once the function has ran its course and rendered whatever it will the variable is destroyed as its not a global variable of any sort.

also

$('.delete').click(function() { 
    var titleID = $(this).attr('rel');
    $.post('titles/delete', { titleID:titleID }, function(data) {
        if (data.success)
        {
            var anSelected = fnGetSelected( oTable );
            oTable.fnDeleteRow( anSelected[0] );
        }
    });
});

If your expecting to work with $.post and data coming back, specifying the data and type you want back is a good idea

$('.delete').click(function() { 
    var titleID = $(this).attr('rel');
    $.post('titles/delete', { titleID:titleID }, function(data) {
        if (data.success)
        {
            var anSelected = fnGetSelected( oTable );
            oTable.fnDeleteRow( anSelected[0] );
        }
    }, 'json');
});

also worth mentioning is rather than trying to work with the datatable object after its rendered.. you could and most likely your easiest route depending on where your "delete" button is located do something like

$(this).parent('tr').remove();

Assuming the button/link whatever, is in the same row as the one to be removed.. you can do something like above mentioned as this is just purely for visual effect of removing the tables row in question. Also assuming your ajax is changing the data for the next time you load the page so its not in the set anymore and thus wont be included on the next load

Answer 2

there are multiple problems with the code u hav provided here...
1.going by the response you are getting for the POST request.
you are getting "YES" value for "Success" property which i dont think if in javascript would take as true .
2. fnGetSelected function of datatables needs an instance to work upon.. you cant just call the function as if it is a global one.. so if u hav the table refrence stored in a varibale like dTable then u can call it as dTable.fnGetSelected()
so probabaly you should change this

var anSelected = fnGetSelected( oTable );

to this

var anSelected = oTable.fnGetSelected();

im assuming that oTable has your datatable
so to debug open the developer tools by pressing f12 and look for javascript error in console or wherever you have depending upon ur browser