Discussion :

[starfiko]

Bonjour,

Sur mon projet de site de e-commerce, je veux afficher mon panier où les valeurs sont affichées dans un tableau créé dynamiquement par une boucle en php :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
 
<?php
while(isset($_SESSION['produit'][$i])){
        if($_SESSION['produit'][$i][0] != $_SESSION['produit'][0][0]){
		$donne= $donne.' OR ';
	}
	$donne=$donne.'id_produit=\'';
 
	$donne = $donne . $_SESSION['produit'][$i][0].'\'';
	$quantitee = $quantitee . $_SESSION['produit'][$i][1].' ';
	$i++;
}
 
$resultat=mysql_query("SELECT id_produit, nom, url, prix, taille, quantitee FROM produit WHERE $donne");
 
if($resultat){
 
	//variable
	$num = mysql_num_rows($resultat);
	$num_rows = $num;
	?>
	         <span id="rows" data-num_rows="<?php echo $num; ?>"></span>
	<?php
 
	//boucle ordre décroissant
	for($num_rows;$num_rows>=1;$num_rows--){
 
		//variable pour inverse l'ordre 
		$num_croissant=$num-$num_rows;
 
		//curseur
		mysql_data_seek($resultat,$num_croissant);
 
		$resul=mysql_fetch_array($resultat,MYSQL_ASSOC);
 
			for($cpt=0;$resul['id_produit'] != $_SESSION['produit'][$cpt][0];$cpt++);
		?>
			<tr>
				<td><?php echo $resul['nom']; ?></td>
				<td><?php echo $resul['taille']; ?></td>
				<td><img src="<?php echo $resul['url']; ?>"></td>
				<td class="a<?php echo $cpt; ?>">
					<img src="img/down-arrow-icon.png" id="down" />
					<input  data-quantitee="<?php echo $resul['quantitee'] ; ?>" type="text" value="<?php echo $_SESSION['produit'][$cpt][1]; ?> "/>
					<img src="img/up-arrow-icon.png" id="up"/>
				</td>
				<td><?php echo $resul['prix']; ?></td>
				<td><?php echo $resul['quantitee'] ; ?></td>
			</tr>
			<?php
			}
mysql_free_result($resultat);
?>

Le soucis, est que je veux donner la possibilitée à l'utilisateur de modifier n'importe quelles quantitées des produits qu'il veut acheter. Comme le tableau est créer dynamiquement, j'ai pu creer des id différentes aux images à chaques tours de boucle(ou ligne du tableau) où lorsque l'on clique dessus, le champ input est censé incrémenter ou décrémenter. J'ai fait la même fonctionnalitée sur une page où un seul article était affiché. Ce qui fonctionnait très bien.
Mais ici, lorsqu'on incrémente ou décrémente c'est tout les champs input du tableaux qui sont modifie en même temps.
Après quelques recherches, il me semble qu'il faut employé la méthode .each()
mais je n'arrive pas avec.

voici l'evenement pour incrémenter le champ input

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
$("#up").on('click',function(event){
		var max = $("#up").prev().attr("data-quantitee");
		var compteur =  parseInt($("#up").prev().val());
			if( compteur < max ){
			$("#up").prev().val(parseInt($("#up").prev().val())+1);
			}
		});

Je suis ouvert à toute suggestion. Merci pour votre aide

[SpaceFrog]

Un id dans une boucle ...

Rappel, un id DOIT ETRE UNIQUE sur la page ...

=> soit tu ajoutes un incrément sur tes id, soit tu passes par un class .

[starfiko]

Oui tu as raison, après modification cela donne

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
<td><?php echo $resul['nom']; ?></td>
<td><?php echo $resul['taille']; ?></td>
<td><img src="<?php echo $resul['url']; ?>"></td>
<td class="a">
	<img src="img/down-arrow-icon.png" id="down<?php echo $cpt; ?>" />
	<input class="a" data-quantitee="<?php echo $resul['quantitee'] ; ?>" type="text" value="<?php echo $_SESSION['produit'][$cpt][1]; ?> "/>
	<img class="x" src="img/up-arrow-icon.png" id="up<?php echo $cpt; ?>"/>
</td>
<td><?php echo $resul['prix']; ?></td>
<td><?php echo $resul['quantitee'] ; ?></td>

De cette manière chaque id créer sont différents.

Une fois cela en place, comment créer un evenement si l'id est inconnu par nous?Peut etre un évenement dans un evenement?(si c'est possible) Mes testes sont peu concluant...

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
$(".a").on('click',function(){
		var id ='#' + $('this : last-child').attr('id');
 
		$("id").on('click',function(id){
		// $('#err').text(id);
		var max = $("id").prev().attr("data-quantitee");
		var compteur =  parseInt($("id").prev().val());
			if( compteur < max ){
			$("id").prev().val(parseInt($("id").prev().val())+1);
			}
		});

Je m'explique ".a" correspond à la balise <td> qui a des enfants <img>, <input>, <img>. Et ce code est censé récupérer l'id du dernière enfant. mais ca ne fonctionne pas du tout...

[starfiko]

J'ai une autre idée, créer dynamiquement un événement click grâce à un événements de type mouseover?

[danielhagnoul]

Bonjour

$( "td.aClass > *:last-child" )[ 0 ].id

[SpaceFrog]

il suffisait juste d emodifier le script précédent pour le selecteur d'id :

id commence par up

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$("[id^='up']")

[starfiko]

C'est super merci à tout les deux pour vos réponses, j'y étais dessus depuis 21h hier....

Voici le code final :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
$("[id^='up']").on('click',function(){
		var max = $(this).prev().attr("data-quantitee");
		var compteur =  parseInt($(this).prev().val());
			if( compteur < max ){
			$(this).prev().val(parseInt($(this).prev().val())+1);
			}
		});

[SpaceFrog]

ou à la place d'un id passer pat un class

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
class="up"
$(".up")