jQuery Data Tables plugin not removing table row

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