Row Selected SERVER SIDE - not Working

omena88

Hello everybody i need a help i have following this example

https://datatables.net/examples/server_side/select_rows.html

and im not getting the results with my code

$(document).ready(function() {
    var selected = [];

    var table = $("#listaUtilizadores").DataTable({

        ajax: {
            url: $("#listaUtilizadores").data("url"),
            data: function (d) {
                var dadosForm = "";
                dadosForm = $("#search_form").serialize();
                return dadosForm + "&" + $.param(d) ;
            },error: function(e){
                console.log(e);
            }
        },
        columns: [
            {data: "nome"},
            {data: "username"},
            {data: "email"},
            {data: "grupo_id",
            render: function ( data, type, full, meta ) {
                switch(data) {
                    case "1":
                        return "Master";
                    case "2":
                        return "Admin";
                    case "3":
                        return "Serviços Administrativos";
                    case "4":
                        return "TSD";
                }
             }
            },
            {data: "created_at"},
            {data: "updated_at"},
            {data: "action", orderable: false, searchable: false}
        ],
        rowCallback: function( row, data ) {

            if ( $.inArray(data.username, selected) !== -1 ) {
                $(row).addClass("selected");

            }

        }
    });


    // Marca as linha selecionadas da tabela
    $("#listaUtilizadores tbody").on( "click", "tr", function () {
        var username = this.username;
        var index = $.inArray(username, selected);

        console.log(username) //undefined, my guest is thes not came from roCallback help!
        console.log(index)
        if ( index === -1 ) {
            selected.push( username );
            //console.log(selected)
        } else {
            selected.splice( index, 1 );
        }

        $(this).toggleClass("selected");
    });
});

I cant see where im wrong, but with console.log i now the var username not coming but when i log(data.username) in roCallback i receive all of then, but in var username = this.username i log(username) i aways receive udefnined some one can help me ?

kthorngren

The key to the example is this:

This is shown in this demo, which uses a unique ID assigned to the TR element (this is done automatically through the use of the DT_RowId special property returned as part of the object given by the server for each row) to track which rows are selected and reselect them is appropriate on a draw.

var username = this.username; will not work in the click event since this does not know about the data structure. You need to use this.id, like this:

    $("#listaUtilizadores tbody").on( "click", "tr", function () {
        var username = this.id;
.....

The functionality relies on having unique IDs assigned to each tr. You can use rowId to set the tr ID to the of the username: rowID: "username",.

Hopefully this gets you going.

Kevin