Remove row, then change page, row is still present

mule

I am loading my datatable from json using javascript on the client. My data is loaded fine. I make some changes to a row, post back the data changes to my server, await a response, and if the response is successful, I remove the row and redraw the table. After removing the row, the row is gone from the datatable, but it reappears after I change pages or pageLength via that show entries per page drowdown control.

What can I do to completely remove the row from the database source so paging will not make it reappear?

Below is my code, shortened for this example.

$('#myTable').DataTable({
    "paging": true,
    "ordering": true,
    "info": true,
    "pageLength": 15,
    "fixedHeader": true,
    "data": ds,
    "columnDefs": [
        // column defs here...
    ],
});

$('.btn-save').on('click', function(e) {
    var row = $(e.currentTarget).closest("tr");
    var data = $('#myTable').dataTable().fnGetData(row);

    var json = {}; // I actually create real json, as not shown

    $.ajax({
        type: 'POST',
        contentType: 'application/json',
        data: JSON.stringify(json),
        url: Routes.ROUTE_TO_MY_CONTROLLER,
        success: function (json) {
            if (json && json.success){
                // I have tried them all, they do remove from 
                // the table, but once I change pages, they are
                // still there.
                row.remove().draw(true);
                //row.remove().draw(false);
                //row.remove().draw();
            }
        },
        error: function (textStatus, errorThrown) {
            console.log(errorThrown);
        }
    });
});

mule

Instead of doing

row.remove().draw();

when I do this

$('#myTable').dataTable().fnDeleteRow(row);

it works.

allan

row.remove().draw(true);

row is a jQuery object, not a DataTables API instance in the above code. There is no draw() method in jQuery so it should really be showing a Javascript error on your browser's console.

I would suggest having:

var table = $('#myTable').DataTable({

Then:

table.row( row ).remove().draw(true);

Allan