Manipulation de contenu, Insérer un élément au bon endroit

Bonjour tout le monde,
Après une journée de reflection, je ne me retrouve pas du tout.
Au fait je suis bidon vide en javaScript de plus.
Voici ce que je cherche à faire, je travail avec JS et PHP, Le php pour stocker mes informations dans la base de donnée de les lister ensuite je les affiche avec JS(AJAX).
Avec le JS je les affiche( AJAX);

<?php
$id_messsage="id_du_message_dans_ma_table";
?>

Voci un exemple pour ulustrer:

<form  method="post" id="comment" onsubmit="CommentPublic(this.comentaire.value, this.idmessage.value); return false">
              <label for="comment"></label>
              <input type="hidden" name="idmessage" id="idmessage" value="<?php echo $id_message;?>"/>
              <input name="comentaire" type="text" id="comentaire" value="" size="40" />
            </form>

Je valide le formulaire en AJAX

<script type="text/javascript">
		  
function getXMLHttpRequest ()
	 {
				var xhr=null;	 

	 if (window.XMLHttpRequest || window.ActivexObjet)
	 {
		if(window.ActiveXObjet)
		
			try
			  {
				xhr=new ActiveXObjet("Msxml2.XMLHTTP");
			  }
				catch (e)
				{
					xhr=new ActiveXObjet("Microsoft.XMLHTTP");
				}
			}
				else{
					xhr=new XMLHttpRequest();
				    }
			 
			 }
			 }
	function CommentPublic(commentaire, idmessage)
		{
				  
		  var newDiv=document.createElement('div');
		  newDiv.id="comment_pub";
				  var xhr= new XMLHttpRequest();
				  var divInsert=document.getElementById('comment_pub');
				  xhr.open('POST',"scripts/comm_pubacc.php",true);
				  xhr.onreadystatechange = function()
				  {
				 if(xhr.readyState==4 && xhr.status==200)
				  { 
		  			newDiv.innerHTML=xhr.responseText;
					divInsert.appendChild(newDiv);

						  
				 }
						 
				  }
	xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');
	xhr.send("commentaire="+commentaire+"& idmessage="+idmessage);  
		}
          </script>

Bien que j'arrive à ajouter le commentaire ensuite j'arrive à l'afficher mais regardez ceci

<?php
//La table message comprend les champs suivants(idmessage (int), message(text), auteur(int), datemessage(datetime);


mysql_select_db($base_de_donne, $utulisateur);
$query_liste_comment="SELECT * FROM messages, membre WHERE message.auteur=membre.id_mmembre ORDER BY date_message DESC LIMIT 0, 5";
$liste_comment=mysql_query($query_liste_comment, $acirfa) or die (mysql_error());
$row_liste_comment=mysql_fetch_assoc($liste_comment);
$total_rows_liste_comment=mysql_num_rows($liste_comment);

//j'affiche tous les messages
do{
$message=$row_liste_comment['message'];
$nom_auteur=$row_liste_comment['nom_membre'];
echo '<div id="comment_pub">'.$nom_membre.'<br />'.
$message.'


</div>'
//Ici est la place du formulaire pour insérer les commentaires
//Je voudrais que chaque message s'affiche avec le formulaire pour ensuite insérer les commentaires
//Le retour seras insérer à ce niveau aussi
//Je voudrais que chaque commentaire s'affiche en bas du message concerné car il contient l'id du message
}while($row_liste_comment=mysql_fetch_assoc($liste_comment));
?>

Après avoir affiché les messages en bas de chaque se trouve un formulaire pour ajouter des commentaires.
Le grand probème est que si vous avez bien constaté nous aurons Cinq(5) messages au total
Ces messages en bas de chacun un formulaire traité par AJAX.
Mais tout ces message on une div parent de meme id="comment_pub";

Le problème est que quand je tente d'afficher les commentaires par:

document.getElementById('comment_pub').appendChild(newDiv);


Il ne considère que seulement l'Id de la première div même si le commentaire a été saisi à la cinquième div,
il l'ajoute à la première.

Excusez moi d'être si long,
S'il vous plait au secours ma tête me fait trop mal.
Merci d'avance.
Modifié par birosalame (16 May 2012 - 14:20)

Hello,

si tu pouvais clarifier un peu ton post ce serait sympa ! Genre utiliser les boutons de mise en forme ou colorisation syntaxique... parce que là, c'est moi qui ai mal à la tête !

Sinon, tu crées plusieurs éléments avec le même ID

a écrit :
echo '<div id="comment_pub">'.$nom_membre.'<br />'.

Or, un ID est un identifiant UNIQUE.

En espérant que ça t'aide un peu !