Aide requête Ajax avec JQuery Type POST

[mikah]

Bonjour,

j'ai un petit soucis avec une requête ajax en jQuery. C'est un ajout de panier basique où j'envoie l'id du produit en POST.

Le problème est le suivant : au premier clic tout vas bien, au second il garde l'id du premier produit envoyé les clics suivants égalements.

Mon code :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
//
// Ajout au panier
//
$('.add-caddy').click(function () {
 
  var fiche =  $(this).attr('value');
 
  alert(fiche);
 
  $.post(
    "ajax-produit-commander.php",
    { 
      fiche: 	fiche
    },  
    function success(data){ 
     alert(data);
    }
  );
 
});

Le selecteur .add-caddy est un simple :

Code :

<a href="javascript:;" value="[id_produit]">

Le fichier ajax-produit-commander.php :

Code :

1
2
echo '<pre>'.$_POST.'</pre>';
exit();

Merci de votre aide.

[Bovino]

Une balise <a> n'a pas d'attribut value...

[mikah]

Certes oui, mais la valeur est tout de même récupérée. D'où le test "alert(fiche);". La balise a est simplement là en test, je remettrai tout çà en ordre une fois le problème résolu. À la base cela devait se gérer dans une page externe, mais j'aimerai le faire en ajax. Je ne pense pas que le problème vient de là.

[Bovino]

Code :

var fiche =  $(this).val();

?

[mikah]

Bovino, désolé pour le flood.

Pour poursuivre mon soucis, j'ai corrigé ces petits soucis de "code propre", vous cherchez vers, selon moi, de mauvaises directions.

Le soucis est que l'envoie répété de la requête ajax reçoi toujours la même données.

Ex :
- Premier clic sur le bouton, valeur 1 envoyée valeur 1 reçue => tout est ok.
- Second clic, valeur 7 envoyée valeur 1 reçu => soucis
- Troisième clic, valeur 22 envoyée, valeur 1 reçu => soucis

Voici tout de même le code corrigé.

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
// Les boutons
<button class="zoom-hover-caddie" onclick="javascript:ajoutPanier(<?php echo $ficheID;?>);">
  Ajouter au panier
</button>
 
// Le JS
<script type="text/javascript">
var ajoutPanier = function(fiche){
  alert(fiche);
  $.ajax({
   type: "POST",
   url: "ajax-produit-commander.php",
   data: "fiche="+fiche,
   success: function(data){
    if (data) {
      alert(data);
    }
   }
  });
};
</script>

[andry.aime]

Bonsoir,

Tu peux nous monter comment tu appelles la fonction sur différentes valeurs dans ton code html?

EDIT: Montre nous ton code HTML généré.

A+.

[mikah]

Bonjour,

merci pour votre réponse. Voici un exemple de code html généré :

Code html :

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
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
 
 
<div id="zoom">
 
    <div class="zoom-sheet zoom-new zoom-first">
      <h3>Chaine or Massif 18 carats</h3>
 
      <a href="/_developpement/clement-couty/fr/produit-fiche.php?fiche=5">
        <img width="158" height="119" title="Chaine or Massif 12 carats" alt="Chaine or Massif 12 carats" src="/_developpement/clement-couty/media/produits/fiches/18/1-chaine-or-massif-12-carats-zoommin.png">
      </a>
 
      <p class="opt_sheet">
        nouveauté
      </p>
      <p class="zoom-price">
      	5 999,00 €
      </p>
 
      <p class="zoom-ref">
        réf:  4563C          
      </p>
      <p class="zoom-stock">
        En stock &#9679;          
      </p>
 
      <button onclick="javascript:ajoutPanier('5');">
        ajouter au panier          
      </button>   
 
      <div class="clear"></div>
 
    </div>
 
 
    <div class="zoom-sheet zoom-new">
      <h3>Bague or Massif 18 carats</h3>
 
      <a href="/_developpement/clement-couty/fr/produit-fiche.php?fiche=12">
        <img width="229" height="173" title="Bague or Massif 18 carats" alt="Bague or Massif 18 carats" src="/_developpement/clement-couty/media/produits/fiches/14/1-bague-or-massif-18-carats-zoommax.png">
      </a>
 
      <p class="opt_sheet">
        nouveauté
      </p>
      <p class="zoom-price">
      	11 999,00 €
      </p>
 
      <p class="zoom-ref">
        réf:  2023C          
      </p>
      <p class="zoom-stock">
        En stock &#9679;          
      </p>
 
      <button onclick="javascript:ajoutPanier('12');">
        ajouter au panier          
      </button>   
 
      <div class="clear"></div>
 
    </div>
 
 
    <div class="zoom-sheet zoom-new  zoom-last">
      <h3>Bracelet Or Massif 18 carats</h3>
 
      <a href="/_developpement/clement-couty/fr/produit-fiche.php?fiche=31">
        <img width="158" height="119" title="Bracelet Or Massif 18 carats" alt="Bracelet Or Massif 18 carats" src="/_developpement/clement-couty/media/produits/fiches/15/1-bracelet-or-massif-18-carats-zoommin.png">
      </a>
 
      <p class="opt_sheet">
        nouveauté
      </p>
      <p class="zoom-price">
      	1 999,00 €
      </p>
 
      <p class="zoom-ref">
        réf:  2029X          
      </p>
      <p class="zoom-stock">
        En stock &#9679;          
      </p>
 
      <button onclick="javascript:ajoutPanier('31');">
        ajouter au panier          
      </button>   
 
      <div class="clear"></div>
 
    </div>
 
 
</div>

[Bovino]

Envoyé par mikah

Ex :
- Premier clic sur le bouton, valeur 1 envoyée valeur 1 reçue => tout est ok.
- Second clic, valeur 7 envoyée valeur 1 reçu => soucis
- Troisième clic, valeur 22 envoyée, valeur 1 reçu => soucis

Manifestement, c'est le traitement coté serveur qui pose problème.

[mikah]

Je pense également, car j'ai vérifié via firebug les données envoyées, et celle-ci sont correctement envoyées. Une config du serveur peut-être ? Si oui laquelle :/

J'avoue être un peu perdu.

[Bovino]

Non, plus probablement ton script PHP.

[mikah]

Beh écoute j'a idéjà cherché dans cette voie et je l'ai "cleané" complètement pour résoudre ce soucis. Celui-ci est réduit à cela :

Code :

1
2
3
4
5
6
 
<?php
	echo '<pre>';
	print_r ($_POST);
	echo '</pre>';
?>

Donc, je pense pas que cela vienne de ce script...

[alpha232]

Salut, peut-être que si tu convertis la valeur de fiche en int dans ton code js, cela pourrait marcher ?

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var ajoutPanier = function(fiche){
  alert(fiche);
  fiche_int=parseInt(fiche);  
$.ajax({
   type: "POST",
   url: "ajax-produit-commander.php",
   data: "fiche="+fiche_int,
   success: function(data){
    if (data) {
      alert(data);
    }
   }
  });
};

C'est juste une idée.

Alpha.