Récupérer Contenu table html

Version imprimable

Bonjour à tous,

Je débutes dans Jquery et j'ai besoin de votre aide :D

J'ai besoin d'utiliser le modal-form proposer par JQUERY : http://jqueryui.com/dialog/#modal-form afin de gérer un nom, une quantité et une référence.

Je souhaite au clik du bouton valider récupérer le contenu de mon tableau html

Exemple : J’ajoute les éléments dans mon tableau de facon dynamique avec les valeurs suivantes :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 <table id="users" class="ui-widget ui-widget-content"> <thead> <tr class="ui-widget-header "> <th class="nom">Nom</th> <th>Référence</th> <th>Quantité</th> </tr> </thead> <tbody> <tr> <td class="nom">Test1</td> <td>test11</td> <td>test111</td> </tr> <tr> <td class="nom">test2</td> <td>test222</td> <td>test222</td> </tr> </tbody> </table>
Ce qui est bizarre avec ce module proposé par JQUERY, c'est que lorsque je consulte le code source de ma page, mes td ne s'affiche pas :?8O, cependant elles apparaissent avec firebug...

Je voudrais être capable de récupérer test1 et test2...

Comme dis, je débutes en JQUERY et je ne sais pas trop par ou commencer..

05/04/2013, 10h51
SpaceFrog

Rien de bizarre à ce que le td rajoutés n'appraissent pas... le code source affiché est figé, il ne l'est pas dans la console de firebug...

Pour ce qui est de la recupération des noms :
http://jsfiddle.net/9896J/

Merci pour la réponse !

J'avais avancé un peu... et ma fonction était différente de la tienne, mais je penses moins efficaces :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 $( "#valider" ) .button() .click(function() { $('#users tbody > tr').each(function() { var nom= $(this).find(".nom").html(); var ref= $(this).find(".ref").html(); var qte= $(this).find(".qte").html(); var res=''; res+=nom+ref+qte; alert(res); }) /* alert(res) ne fonctionne pas ici */ }); });
Je veux en fait récupérer le contenu du tableau...et l'afficher à la fin

Sauf qu'avaec ma fonction, j'affiche ligne par ligne... est-ce possible d'afficher le tableau en entier d'un coup ?

05/04/2013, 11h16
SpaceFrog

oui en dehors de la boucle ...

Oui, j'ai bien essayé, sauf que ça ne marche pas (aucune alerte s'affiche) :mur:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$( "#valider" )
.button()
.click(function() 
{
 
	$('#users tbody > tr').each(function() {
       var nom= $(this).find(".nom").html();
	   var ref= $(this).find(".ref").html();
	   var qte= $(this).find(".qte").html();
	   var res='';
	   res+=nom+ref+qte;  
    })
	alert(res);
});
});

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<table id="users" class="ui-widget ui-widget-content">
<thead>
<tr class="ui-widget-header ">
<th>Nom</th>
<th>Référence</th>
<th>Quantité</th>
</tr>
</thead>
<tbody>
<tr>
<td class="nom">test</td>
<td class="ref">test</td>
<td class="qte">test</td>
</tr>
<tr>
<td class="nom">test2</td>
<td class="ref">test2</td>
<td class="qte">test2</td>
</tr>
</tbody>
</table>

05/04/2013, 11h28
SpaceFrog
rien d'étonnant
vu que tu vides res à chaque fois ...
Code:

1 2 3 var res=''; res+=nom+ref+qte;
05/04/2013, 11h32
jujurochedu42

Oui, mais je devrais au moins avoir une alerte vide nan ?

Là, l'alerte ne se déclenche même pas...

Aprés modif du code, même soucis :?

http://jsfiddle.net/9896J/6/
05/04/2013, 11h52
SpaceFrog

http://jsfiddle.net/9896J/11/