How to remove a single line from datatable

pedrogilsantos

Hi all,

I need do delete a record from a datable, clicking on a button, set on each row, that will fire a callbackto delete the record from the database through an ajax request.

This part works fine, but after confirming that record was deleted with success, I want to remove the row from the datatable to refresh datatable without doing a new request to the server.

I'm trying to use rowId property as selector but without success and nothing happens...

t=$('#my_table').DataTable({
"dom": 'rtp',
"ajax": {
"url": "php/getPedidos.php",
"dataSrc": "",
"rowId": 'idPedido'
},
ordering: true,
order: [[0, "desc"]],
select: false,
"columns": [
{"data": 'idPedido', "title": "#", "orderable": true, "type": "numeric"},
{"data": 'marcacao', "title": "Data", "orderable": true, "type": "string"},
{"data": 'motivo', "title": "Motivo", "orderable": true, "type": "string"},
{"data": 'observacoes', "title": "Observações", "orderable": false, "type": "string"},
{"data": 'estado', "title": "Pedido", "orderable": true, "type": "string"},
{"data": null, "title": "", "orderable": false, "type": "string", render: function (row) {
return'<a class="btn btn-link delete-record" data-toggle="confirmation" data-idp="' + row.idPedido + '" aria-label="Eliminar" title="Eliminar este pedido?" data-btn-Ok-Label="Sim" data-btn-Cancel-Label="Não"><i class="fa fa-trash-o" aria-hidden="true"></i></a';
}
},
{"data": 'dataEstado', "title": "Data ", "orderable": true, "type": "string"},
{"data": 'observacoesEstado', "title": "Observações", "orderable": false, "type": "string"},
{"data": 'responsavel', "title": "Responsável", "orderable": true, "type": "string"}
],
"initComplete": function (settings, json) {
//creat delete confirmation button after table loaded
$(document).find('[data-toggle="confirmation"]').confirmation();
$(document).delegate('.delete-record', 'confirmed.bs.confirmation', function () {
//callback to delete record
delPedido($(this).attr('data-idp'));
});
}
});

//callback to delete record
function delPedido(idp) {

$.ajax({
    method: "POST",
    url: "php/delPedidoMarcacao.php",
    data: {idp: idp},
    success: function (result) {
        $.notify({
            //option 
            title: result
        }, {
            //settings
            type: 'success',
            allow_dismiss: true,
            placement: {
                from: 'top',
                align: "center"
            }
        });

     //remove row from datable based on rowId that is an integer UID 
     t.row("#"+idp).remove().draw(); 

Thanks in advance
Pedro