Comment obtenir la valeur d'une cellule de table en utilisant jQuery ?
jQuery permet de sélectionner n'importe quel élément dans une page HTML. Ce qui peut être utile pour récupérer le contenu d'un tableau.
Il est possible grâce à jQuery de sélectionner n'importe quel élément dans une page HTML. Cela peut être utile pour récupérer, par exemple, le contenu d'une cellule dans un tableau. Exemple de tableau :
<table id=maTable> <tr> <th>Identifiant</th> <th>Resultat</th> </tr> <tr> <td>123</td> <td></td> </tr> </table>
La fonction each() de jQuery permet d'exécuter du code pour chaque élément récupéré par le sélecteur. En sélectionnant toutes les lignes, on peut ainsi récupérer la cellule de chaque ligne. Pour trouver la cellule, la fonction find(), avec en paramètre la chaîne td, permet de récupérer toutes les cellules et la fonction eq() récupère l'élément à l'index souhaité :
$('#maTable tr').each(function() {
var identifiant = $(this).find(td).eq(0).html(); //L'index 0 permet de récupérer le contenu de la première cellule de la ligne
});
Si la cellule que vous souhaitez sélectionner est la première ou la dernière de la ligne, on peut remplacer la fonction eq() par les mots-clés :first et :last dans le sélecteur :
$('#maTable tr').each(function() {
var identifiant = $(this).find(td:first).html();
});
Une autre solution consiste à appliquer une classe sur la cellule visée. De cette manière, un changement dans la structure de la table, comme l'ajout ou la suppression d'une colonne, ne provoquera aucun changement à effectuer dans le code JavaScript. Il sera de plus possible de sélectionner les cellules dans un seul sélecteur plutôt que d'utiliser la fonction each() :
var identifiants = $('#mytable .celluleIdentifiant');