Changing pages, JS stop working

punchi

As you may see on this gif/video:

https://media.giphy.com/media/3o7qDLTKz3LAKUauLS/giphy.gif

The confirm and tooltip works fine on the first page, but changing page... it doesn't work anymore =(

Some code:

$('#datatable').DataTable( {
    "processing": true,
    "serverSide": false,
    "ajax": {
            "url": "{{ URL::to('ProductosJSON') }}",
            "type": "POST",
            "data": function (d) {
                d.nombre = $("#lista_nombre").val();
           }
        }
} );

$(document).ajaxStop(function () {
    $('[data-toggle="tooltip"]').tooltip();
    $('[data-toggle="confirmation"]').confirmation();
});

What im doing wrong? I download the latest version, still can't make it work =/

Thanks guys!

punchi

I solve it when the change page event is triggered

// Refresca la confirmacion y tooltip
$('#datatable')
        .on('page.dt', function () {
            setTimeout(function () {
                $('[data-toggle="tooltip"]').tooltip();
                $('[data-toggle="confirmation"]').confirmation();
            }, 0);
        })
        .DataTable();

If there's a more elegant solution, it's welcome =)

allan

The best way is to use delegate events, as noted in this FAQ. I'm not sure if the jQuery plug-ins you are using have that option through. Perhaps createdRow could be used instead, to make sure they are only activated on each row once.

Allan