Hide or delete table row when deleting the record

1

I have a table that displays a list of clients and has a fluff next to it to delete each client. I want to do this deletion via ajax, how do I make the line that is deleted from the client disappear without having to refresh the page?

Note: I'm using the jQuery Datatable plugin

<table id="appDatatable" class="table table-bordered table-hover">
    <tbody>
    @foreach($clientes as $cliente)
        <tr>
            <td>{{ $cliente->email }}</td>
            <td>{{ $cliente->telefone }}</td>
            <td class="text-center">
                ...
                <a class="btn btn-danger btn-sm" title="Excluir cliente"
                   onclick="conf('{{ $cliente->id }}');">
                    <span class="fa fa-close"></span>
                </a>
            </td>
        </tr>
    @endforeach
    </tbody>
</table>

    
asked by anonymous 22.09.2016 / 21:04

2 answers

2

I often use this:

$("#tabela").on("click",".deletaBtn", function() {
    var tr = $(this).closest('tr');
    tr.css("background-color","yellow");
    tr.fadeOut(600, function(){
        tr.remove();
    });
    return false;
});

Where .Btndelete is the class defined in the delete button

I do not know if Datatable has a function of its own. Go help yourself.

    
22.09.2016 / 21:17
1

The jQuery DataTable has the method fnDeleteRow to delete a table row .

After the successful return of your AJAX , you can include for example:

var tabela = $('#tabela').dataTable();
tabela.fnDeleteRow( N ); // onde N é o índice da linha a ser excluída da tabela
    
22.09.2016 / 21:24