Div dans Ajax ne fonctionne pas
Résolu
parousky
Messages postés
325
Date d'inscription
Statut
Membre
Dernière intervention
-
parousky Messages postés 325 Date d'inscription Statut Membre Dernière intervention -
parousky Messages postés 325 Date d'inscription Statut Membre Dernière intervention -
Bonjour, j'ai un petit problème sur lequel je me pète la tronche depuis plusieurs heures, je ne vois vraiment pas ce qui cloche !
J'effectue une requête SQL, je parcours les résultats et je mets un div à l'intérieur avec un bouton. En cliquant sur le bouton, j'envoie ce qui est dans le div par Ajax :
Mais le problème, c'est que dans mon div, il n'y a toujours que la première valeur renvoyée par la requête SQL, et il y a bien autant de bouton/div que de résultats de la requête !
J'avais déjà utilisé cette technique, mais jamais avec une requête SQL en "query", est-ce que cela pourrait venir de là ?
Merci d'avance pour vos réponses !
J'effectue une requête SQL, je parcours les résultats et je mets un div à l'intérieur avec un bouton. En cliquant sur le bouton, j'envoie ce qui est dans le div par Ajax :
<script language="Javascript">
function Favoris()
{
var XTicker = document.getElementById('ticker').innerHTML;
var XFavoris = 1;
console.log(XTicker);
$.ajax({
type: "POST",
url: "Traitement.php",
data: {Favoris: XFavoris, Ticker: XTicker}
});
}
</script>
<?php
$req = $bdd->query('SELECT * FROM valeurs ORDER BY ProbaPlus DESC');
while($donnees = $req->fetch())
{
?>
<div id="ticker"><?php echo $donnees['Ticker'];?></div>
<input type="button" onclick="Favoris()">Favoris</input>
<?php
}
?>
Mais le problème, c'est que dans mon div, il n'y a toujours que la première valeur renvoyée par la requête SQL, et il y a bien autant de bouton/div que de résultats de la requête !
J'avais déjà utilisé cette technique, mais jamais avec une requête SQL en "query", est-ce que cela pourrait venir de là ?
Merci d'avance pour vos réponses !
3 réponses
-
Bonjour
Ce n'est pas une question de query.
C'est que dans ton formulaire, tu crées plusieurs div qui ont tous le même id : ticker. Ceci est interdit, un id doit par définition être unique. Tondocument.getElementById('ticker')prend le premier "ticker" qu'il trouve, il n'a aucune raison d'aller en chercher un autre. Il n'y a aucune association entre chaque bouton et chaque div, si ce n'est dans ta tête, mais ça, javascript ne peut pas le deviner.
Tu peux t'en tirer en créant des id uniques (en ajoutant un compteur à la fin de 'ticker' par exemple, et en le passant en paramètre à 'Favoris', qui ira ainsi chercher "son" id et pas le premier qui se présente.
J'avais déjà utilisé cette technique Non, tu n'avais certainement pas fait comme ça. Tu utilisais obligatoirement un moyen ou un autre pour distinguer tes div les uns des autres. -
Bonjour,
Je ne comprend pas trop....
Ton code PHP est celui appellé par ton ajax ?
Si oui... il ne mettra rien à jour... car il ne s'execute pas dans la page en cours....
Pour mettre à jour ta div.. il faut le faire dans le SUCCESS de ton ajax.
function Favoris(){ var XTicker = document.getElementById('ticker').innerHTML; var XFavoris = 1; console.log(XTicker); $.ajax({ type: "POST", url: "Traitement.php", data: {Favoris: XFavoris, Ticker: XTicker}, async: false, dataType: "html", success: function(reponse){ console.log(reponse); $("#ticker").html(reponse); }, error:function(reponse){ alert('error !\n' + reponse); } }); }- reponse etant le résultat (print ou echo) de ton fichier PHP...
par exemple :<?php echo "ceci est la réponse !"; ?>
EDIT : En lisant la réponse de le père.. j'ai compris ta question et ton souci....
En effet,... ta fonction ne marchera pas car tu utilises X fois le même ID....
Tu peux y remedier en faisant un truc du genre....<?php $req = $bdd->query('SELECT * FROM valeurs ORDER BY ProbaPlus DESC'); $r = 0; while($donnees = $req->fetch()) { echo " <div id='ticker".$r."'>".$donnees['Ticker']."></div>"; echo " <input type='button' onclick='Favoris(\"ticker".$r."\");'>Favoris</input>"; $r++; } ?>
et dans ton JS:function Favoris(id_div){ var XTicker = $("#"+id_div).html(); var XFavoris = 1; console.log(XTicker); $.ajax({ type: "POST", url: "Traitement.php", data: {Favoris: XFavoris, Ticker: XTicker} }); }
Cordialement,
Jordane -
Merci beaucoup pour vos réponses !
Et pour disparaître avec les honneurs, je n'ai pris que quelques portions de code que Jordane a donné, je les ai modifié pour l'adapter au code pour ne pas faire de copier/coller pur et dur !
Encore merci !
