Bonsoir ! Smiley cligne

J'ai un problème au niveau de l'affichage des commentaires de ma base de données.

Coté PHP cela fonctionne très bien seul ( les commentaires s'affichent les uns au dessus des autres ! ) Smiley murf

Mais voila problème, j'ai voulu mettre un peu de JAVASCRIPT pour n'ouvrir le bloc des commentaires que si l'on clique sur le bouton "commentaires" Smiley biggol

Et la SURPRISE ! Cela marche ... enfait non, puisque seul le dernier commentaire de la table est affiché !! Smiley bawling

Je vous met le bout de code : ( ne faite pas attention au requête préparé, le code n'est pas complet Smiley ravi ) :



<div style="position:absolute; left:50%; top: 50% ; z-index: 15; width: 20%;height: 40%;     ">
		<div id="comm" style="height:100%"></div>
<div id="sup"></div>
</div>





<?php


$reponse = $bdd->query("SELECT comm FROM commentaire WHERE idimage = '$images' ");
 
// Affichage de chaque message (toutes les données sont protégées par htmlspecialchars)
while ($donnees = $reponse->fetch())
{
  
  
   
?>


<script>

var commentaire = document.getElementById ('commentaire') ;

commentaire.addEventListener ('click', function () {

document.getElementById('comm').innerHTML = '<div style="background-color:black;opacity:0.8;color:white; border-radius : 8px; height: 100%; width: 100%"><h3 style="text-align:center">Commentaires </h3><?php echo '<p style="margin-left:7%; margin-right:7%; word-wrap: break-word;">'. $donnees["comm"] .'</p>' ;?></div>' ;
document.getElementById('sup').innerHTML = '<span style=""><img src="sup.png"  alt="suprimer" width="5%" /> </span>' ;


}, false )  ; 


var comm = document.getElementById ('sup') ;

comm.addEventListener ('click', function () {

document.getElementById('comm').innerHTML = '' ;
document.getElementById('sup').innerHTML = '' ;


}, false )  ; 


</script>

<?php }

?>







Voila, j'espère que vous comprendrez le problème et que vous pourrez m'éclairer ! Smiley confused

Pour moi cela à un rapport avec le fait que l'on place le js obtenue après l'application de la boucle while et peut etre que c'est cela qui cloche ? Smiley sweatdrop

J'attend vos réponses avec impatience , bonne soirée à tous !! Smiley smile
Normal ! Dans ta boucle, tu écrases systématiquement l'innerHTML précédent :

document.getElementById('comm').innerHTML = '<div style="background-color:black;opacity:0.8;color:white; border-radius : 8px; height: 100%; width: 100%"><h3 style="text-align:center">Commentaires </h3><?php echo '<p style="margin-left:7%; margin-right:7%; word-wrap: break-word;">'. $donnees["comm"] .'</p>' ;?></div>' ;
document.getElementById('sup').innerHTML = '<span style=""><img src="sup.png"  alt="suprimer" width="5%" /> </span>' ;


Il faudrait plutôt concaténer les innerHTML. Je te le fais à la crade avec l'opérateur += :

document.getElementById('comm').innerHTML += '<div style="background-color:black;opacity:0.8;color:white; border-radius : 8px; height: 100%; width: 100%"><h3 style="text-align:center">Commentaires </h3><?php echo '<p style="margin-left:7%; margin-right:7%; word-wrap: break-word;">'. $texte .'</p>' ;?></div>' ;
document.getElementById('sup').innerHTML += '<span style=""><img src="sup.png"  alt="suprimer" width="5%" /> </span>' ;