Discussion :

[kevin29]

Salut à tous!

merci à vous qui prenez le temps de lire ce message

Petite présentation du code défaillant :

1) Un bouton "message" est placé sur mon site.

2) en cliquant sur ce bouton, une division dédiée aux messages persos s'ouvre (ainsi qu'une en-tête, pas important). En outre, la fonction "actualiser_messages" est appelée.

3) cette fonction envoie une requête (ajax) pour récupérer les messages dans ma bdd. Les infos recueillies sont renvoyées sous le format :
id-nom-prenom/message-message|id-nom-prenom/message-message-message ...
(id, nom, prenom de l'envoyeur)

4) les données reçues sont alors triées de façon à afficher toutes les conversations (1 par personne ).
Le nom de l'envoyeur ainsi que le premier message y figure.

5) En cliquant sur une conversation, les messages s'affichent à la place des conversations.


Voici le code :

Code html :

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

1
2
3
4
5
6
<div id="messages_persos"> Messages </div>
<div id="en-tete"> 
  <div id="fermeture"> X </div>  
</div>
<div id="conversations">
</div>

Code :

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
 var div_message = document.getElementById('messages_persos');
 var div_conversations = document.getElementById('conversations');
 var entete = document.getElementById('en-tete');
 div_message.onclick = function() {
	 entete.style.display = 'block';	
	 div_conversations.style.display = 'block';	
         actualiser_messages();		 
 };
 document.getElementById('fermeture').onclick = function () { div_conversations.style.display = 'none'; entete.style.display = 'none'; };
function actualiser_messages() {
  var xhr = new XMLHttpRequest();
  xhr.open('GET','nv_messages.php');
  xhr.onreadystatechange = function () { 
      if (xhr.readyState == 4 && xhr.status == 200){
	    var reponse = xhr.responseText;
		  if(reponse.length){
			 var tab_reponses = reponse.split('|'),
			     tab_reponses_long = reponse.length;
		div_conversations.innerHTML='';   	 
			for ( var i=0, div; i<tab_reponses_long; i++){
			   div=div_conversations.appendChild(document.createElement('div'));
			   var conversation = tab_reponses[i].split('/');
			   var expediteur = conversation[0].split('-');
			   var messages = conversation[1].split('-');
			   div.innerHTML = '<span>'+expediteur[1]+' '+expediteur[2]+'</span> <br/>'+messages[0];
			   var messages_len = messages.length;
			   div.onclick = function (){
				div_conversations.innerHTML='';  
				for (var j=0, div2; j<messages_len; j++){
					div2=div_conversations.appendChild(document.createElement('div'));
					div2.innerHTML=messages[j];
				}
			}; 
		}  
	}
   }
}; 
  xhr.send(null);	
 }

Le problème ?

Tout va très bien jusqu'à l'étape 4, le nom s'affiche, ainsi que le premier message. Mais à l'étape 5, en cliquant sur une conversation (n'importe laquelle), c'est forcement les messages de la dernière conversation de la boucle qui s'affichent.

Quelqu’un aurait-il une idée du problème?
Merci d'avance

[NoSmoking]

Bonjour,
Comment attribuer à des objets un onclick faisant appel à une variable de boucle ?