2011-11-23 17 views
9

Sto usando datatables nella mia applicazione. Ogni volta che l'utente fa clic su qualsiasi riga, voglio evidenziarlo e selezionare alcuni valori dalla riga selezionata.Come selezionare una riga in Jquery datatable

"oTableTools": { 
       "sRowSelect": "single", 

       "fnRowSelected": function (node) { 
        var s=$(node).children(); 
         alert("Selected Row : " + $s[0]); 
        } 

ho cercato sRowSelect e fnRowSelected ma senza fortuna. La riga non è evidenziata e non viene chiamato né fnRowSelected. Anche nessun errore sulla console.

Ecco il mio codice completo

var userTable = $('#users').dataTable({ 
      "bPaginate": true, 
      "bScrollCollapse": true, 
      "iDisplayLength": 10, 
      "bFilter": false, 
      "bJQueryUI": true, 
      "sPaginationType": "full_numbers", 
      "oLanguage": { 
       "sLengthMenu": "Display _MENU_ records per page", 
       "sZeroRecords": "Enter a string and click on search", 
       "sInfo": "Showing _START_ to _END_ of _TOTAL_ results", 
       "sInfoEmpty": "Showing 0 to 0 of 0 results", 
       "sInfoFiltered": "(filtered from _MAX_ total results)" 
      }, 
      "aaSorting": [[ 0, "asc" ]], 
      "aoColumns": [/* Name */ null, 
          /*Institution*/null, 
          /*Email*/null], 
      "oTableTools": { 
       "sRowSelect": "single", 

       "fnRowSelected": function (node) { 
       alert("Clicked"); 
        } 
      }  
     });  

Mi sto perdendo qualcosa?

EDIT:
Ora in grado di evidenziare selezionato class row.Added = "display" alla tabella HTML. Mi chiedo ancora perché non l'ho trovato nei documenti datatable. Ora guarda come raccogliere i valori selezionati.

risposta

5

Ecco come lo faccio

Basta aggiungere questa funzione alla tua pagina (se gli utenti è il vostro tavolo id)

$("#users tbody").delegate("tr", "click", function() { 
var iPos = userTable.fnGetPosition(this); 
if(iPos!=null){ 
    //couple of example on what can be done with the clicked row... 
    var aData = userTable.fnGetData(iPos);//get data of the clicked row 
    var iId = aData[1];//get column data of the row 
    userTable.fnDeleteRow(iPos);//delete row 

} 
+0

grazie per aver dato una soluzione semplice. Ho usato "$ (. Row_selected)" per trovare la riga selezionata e poi ho filtrato tutti i dati usando ancora il selettore jquery. – xyz

0

La classe selezionata deve essere, all'interno della funzione utilizzata $s e si definisce var s che non è la stessa var.

"oTableTools": { 
      "sSelectedClass": "yourclassname", 
      "sRowSelect": "single", 
      "fnRowSelected": function (node) { 
       var s=$(node).children(); 
        alert("Selected Row : " + s[0]); 
       } 
     } 
+0

Abbiamo bisogno di applicare la nostra classe a ' sSelectedClass'? – xyz

+0

Non lo so, ma poiché c'era un errore all'interno della tua funzione, l'evidenziazione potrebbe essere stata interrotta. – Niels

+0

L'ho cambiato, grazie. Controlla la mia modifica. Non funziona ancora. – xyz

3

Quando si utilizza fnRowSelected (vale a dire la creazione di nuovi tabletool) devi usare

"sRowSelect": "multi", 

Questo risolverà il problema. Si prega di incrementare il conteggio dei commenti se aiuta. Ho bisogno di avere più punti.

ho usato nel mio codice come segue

pqrtbl = new TableTools(NameOfTbl, { "sRowSelect": "multi", 
             "fnRowSelected": function (node) { 
              var s= $(node).children(); 
              fnAddToSelLst(s[1].innerText); 
             },....................... 

//column index depend upon your req. 
0

Se si vuole selezionare fila multipla, vogliono ottenere i dati di riga selezionata a scopo ajax controllare questo

http://jsfiddle.net/ezospama/1/

codice DataTable volontà essere come segue

$(document).ready(function() { 
    var table = $('#datatable').DataTable(); 

    $('#datatable tbody').on('click', 'tr', function(){ 
     $(this).toggleClass('selected'); 
    }); 

    $('#btn').click(function() { 
     console.log(table.rows('.selected').data()); 
     alert("Check the console for selected data"); 
    }); 
}) 
Problemi correlati