web-dev-qa-db-fra.com

Parcourez la table DataTables pour obtenir le contenu de toutes les cellules

J'utilise jquery dataTables pour générer la table paginée sur mon site. J'ai besoin d'exécuter un processus qui récupère toutes les données d'une colonne particulière. Quelque chose comme :

$('.testLink').click(function(){
            var cells = new Array();
            $('#myTable tr td').each(function(){
                cells.Push($(this).html());
            });
            console.log(cells);
        });

Cet exemple saisit tout mais j'aurais besoin seulement des informations d'une colonne de tds. Je suppose que je pourrais le faire en ajoutant une classe à tous les tds de cette ligne, mais je suis sûr qu'il existe une meilleure façon. C'est une question bonus ..

mais ce que je veux vraiment savoir, c'est comment faire fonctionner cela avec les tables de données? Étant donné que le script masque la majeure partie du tableau pour le mettre en pagination, cette fonction ne saisit que les cellules visibles. J'ai joué avec fnGetData mais je ne comprends pas. Des idées?

jquerydatatables
22
Zac

Pour accéder à toutes les lignes, vous pouvez faire:

var rows = $("#myTable").dataTable().fnGetNodes();

Dans votre cas, cela devrait fonctionner:

   $('.testLink').click(function(){
        var cells = [];
        var rows = $("#myTable").dataTable().fnGetNodes();
        for(var i=0;i<rows.length;i++)
        {
            // Get HTML of 3rd column (for example)
            cells.Push($(rows[i]).find("td:eq(2)").html()); 
        }
        console.log(cells);
    });
47
Diego

Voici une méthode utilisant fnGetData ()

Obtenez d'abord les données du plugin qui sera visible ou non sur toutes les lignes. Faire une boucle sur chaque tableau de données de ligne et pousser l'index = 1 (deuxième cellule) dans le nouveau tableau

     oTable = $('#example').dataTable();

      var secondCellArray=[];
      $.each( oTable.fnGetData(), function(i, row){
          secondCellArray.Push( row[1]);
    })

     console.log( secondCellArray)

EDit: démo de travail ... regardez dans la console après le rendu

http://live.datatables.net/apixiv/edit#javascript,html

6
charlietfl

jQuery.map combiné avec fnGetData() constitue une solution compacte. La fonction suivante retournera un tableau unidimensionnel contenant toutes les valeurs de la colonne n de obj_dtable:

function getDataTableColumn(obj_dtable,n) {
    return $.map(obj_dtable.fnGetData(), function(val) {
        return val[n];
    });
};
4
Blazemonger

Vous voudrez utiliser le sélecteur "EQ". Cela commence à l'index "0", donc si vous avez ..

<tr>
  <td>0</td>
  <td>1</td>
  <td>2</td>
  <td>3</td>
</tr>

Puis en utilisant

 $("td").eq(3); // last one
 $("td").eq(2); //returns "2"

Ça a du sens?

http://api.jquery.com/eq-selector/

1
Ohgodwhy