row selection server side

rouine

hello friends,
I want a table with server side processing but with User selectable rows (multiple rows) features.
With server side table when change current page and when come back, the first selection disappear.

this my code:

$(document).ready(function() {
    /*fetchData();
    $("#filter").click(function(e){
        fetchData();
    })*/
    var selected = [];
    var url = "<?=base_url().'Hpg_leads/getIncomingLeadList';?>";
    $("#full-database-table").dataTable({
        "destroy": true,   
        "autoWidth": true,
        "pageLength" : 25,
        "processing": true,
        "serverSide": true,
        "order": [[3,"desc"],[4,"desc"],[6,"asc"]],
        "ajax": {
            "url": url,
            "type": "POST",
            "data": function(dtParms){
                source_ids = ($('#id_source').val()).join(',');
                dtParms.idsource = source_ids;
                dtParms.starting_date = $('#starting_date').val();
                dtParms.ending_date = $('#ending_date').val();
                console.log(dtParms);
                return dtParms;
            },
        },
        "rowCallback": function( row, data ) {
            if ( $.inArray(data.DT_RowId, selected) !== -1 ) {
                $(row).addClass('selected');
            }
        },
        language: {
            "processing":"Traitement en cours...",
            searchPlaceholder: '',
            sSearch: 'Rechercher : ',
            lengthMenu: 'Afficher _MENU_ leads par page',
            paginate:{"previous":"Précédent", "next":"Suivant"},
            zeroRecords: "Aucune information n'est disponible",
            info: "Affichage de page _PAGE_ de _PAGES_",
            infoEmpty: "Aucune information n'est disponible",
            infoFiltered: "Filtrage de _MAX_ total leads"
          },
           "columnDefs": [
            {
            "targets": 2,
            "render": function ( data, type, row) {
            return "<div class='btn-group'> <a target='_blank' href='editLead/"+row[9]+"' id='"+row[9]+"'  class='btn btn-white btn-xs'>Editer</a><a href='javascript:void(0);'  id='"+row[3]+"' class='dataTrip btn btn-white btn-xs'>Acheminement</a></div>";

            } ,
            }
            ],
    });
    $('#full-database-table tbody').on('click', 'tr', function () {
        var id = this.id;
        var index = $.inArray(id, selected);
 
        if ( index === -1 ) {
            selected.push( id );
        } else {
            selected.splice( index, 1 );
        }
 
        $(this).toggleClass('selected');
    } );
 });

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

colin

Yep, with serverSide, the table is fully redrawn each time the page changes. You would need to keep a record of which records were selected yourself and reapply that selection. Note this could be tricky, as ordering and searching could change the position of records so you would need to store the row ID rather than it's position.

Colin