Ajax : écrire dans un div

Répondre
Zobaree
le 24/02/2008 à 21:04
Zobaree
Déconnecté
Salut à tous!

J'ai un petit soucis, j'ai fais une shoutbox en php/sql/javascript tout bien intégrée à mon site. Pour afficher les messages j'ai utilisé du javascript comme ceci:
  1. function showMessage(){
  2. var x_object2 = null;
  3.    if(window.XMLHttpRequest){
  4.       x_object2 = new XMLHttpRequest();
  5.    }else if(window.ActiveXObject){
  6.       x_object2 = new ActiveXObject("Microsoft.XMLHTTP");
  7.    }else{
  8.       alert('Votre navigateur de supporte pas la technologie AJAX(XMLHttpRequest)...');
  9.    return;
  10.    }
  11.    
  12.    
  13.    x_object2.open("POST","messages.php",true);
  14.    x_object2.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
  15.    x_object2.send(null);
  16.    
  17.    x_object2.onreadystatechange = function(){
  18.       if(x_object2.readyState==4){
  19.          if(x_object2.status==200){
  20.          self.frames["tchat"].document.body.innerHTML = x_object2.responseText;
  21.          descendreTchat();
  22.          Layer1.style.visibility="hidden";
  23.          }
  24.       }
  25.    }
  26.    
  27. } 

(La façon dont s'affiche les messages est contenu dans message.php car je le réutilise pour autre chose.
Dans mon template, j'ai donc mis cela pour afficher les messages:
  1. <iframe name="tchat" width="700px" height="350px" scrolling="auto" style="border: 0 solid;"></iframe> 


Tout marche... cependant, c'est bien beau, mais les iframe c'est une hérésie, j'aimerais bien que ça s'affiche dans un div (avec scroll). Je me demandais si c'était possible. Si oui, que dois-je remplacer?

Merci à vous!
LA GLOBULE
le 24/02/2008 à 21:20
LA GLOBULE
Déconnecté
111 111 111 x 111 111 111 = 12 345 678 987 654 321
Pour faire scroller un div, tu dois appliquer une propriété overflow: scroll au div.

Ensuite, je n'ai pas testé ton code, mais il semblerait qu'il récupère un texte pour l'écrire dans une iframe (truc de t'chat), et oui, forcément, c'est faisable avec un div.
Zobaree
le 24/02/2008 à 21:32
Zobaree
Déconnecté
Yep, il récupère les messages contenus dans ma DB sql... (envoyés par un form)

Pourrais tu me donner un petit coups de main pour le div côté javascript? Après recherche je ne trouve pas...

Ca me parle pas du tout ce langage... :/
LA GLOBULE
le 24/02/2008 à 22:11
LA GLOBULE
Déconnecté
111 111 111 x 111 111 111 = 12 345 678 987 654 321
Ben pour écrire dans un div, tu peux faire :

  1. document.getElementById('id_du_div').innerHTML = 'du texte'; 
Zobaree
le 24/02/2008 à 23:13
Zobaree
Déconnecté
Ha merci beaucoup, l'affichage fonctionne!
  1. document.getElementById('shoutbox').innerHTML = x_object2.responseText; 

  1. <th height="300px"><div id="shoutbox"></div></th> 


Comme tu peux le voir, le div fait fait parti d'un tableau. J'aimerais que la hauteur maximale soit de 300px, cependant, au fil des messages, la tableau s'agrandit.
Sais-tu comment limiter le nombre de messages affichés? Ce qui m'éviterait d'avoir un scrollbar et un tableau avec une taille immense...
LA GLOBULE
le 25/02/2008 à 01:03
LA GLOBULE
Déconnecté
111 111 111 x 111 111 111 = 12 345 678 987 654 321
Ben comme je te l'ai dis, il faut mettre un overflow: scroll sur ton div pour qu'il scroll et que ton tableau ne grandisse pas.
Bzh
le 25/02/2008 à 12:42
Bzh
Déconnecté
Il faut aussi préciser width et height !
Zobaree
le 25/02/2008 à 17:33
Zobaree
Déconnecté
@ LA GLOBULE: Non justement j'aimerais éviter d'avoir un scroll, j'aimerais qu'il n'affiche que x messages dans le div...

@ Bzh: J'ai déjà donné une longueur/largeur, mais ça n'a pas résolu le problème du nombre de messages affiché :P

(Merci à vous deux!)
LA GLOBULE
le 25/02/2008 à 17:55
LA GLOBULE
Déconnecté
111 111 111 x 111 111 111 = 12 345 678 987 654 321
Ben contrôle mieux ton JS pour savoir combien de message tu écris.

Et si tu dépasses un certain nombre (ou bien un certain nombre de caractères), ben effectue le traitement que tu veux (soir arrêter d'écrire, soit effacer le message le plus vieux, soit lancer un mp3, soit fermer le navigateur, je ne sais pas moi).
Zobaree
le 25/02/2008 à 21:32
Zobaree
Déconnecté
En faite j'ai juste limité l'affiche dans la query (SELECT ... LIMIT 25).
Je ne sais pas si c'est une bonne solution, mais avec le js j'ai encore du mal... :)
LA GLOBULE
le 25/02/2008 à 22:17
LA GLOBULE
Déconnecté
111 111 111 x 111 111 111 = 12 345 678 987 654 321
Entre nous, la bonne solution, c'est de ne pas faire de tchat en php / sql / javascript :)
Zobaree
le 26/02/2008 à 22:31
Zobaree
Déconnecté
Ha tien, comment donc? flash? :P
LA GLOBULE
le 26/02/2008 à 23:13
LA GLOBULE
Déconnecté
111 111 111 x 111 111 111 = 12 345 678 987 654 321
Flash couplé à un serveur IRC oui, ou bien une applet Java.
Répondre
Accès rapide :

Remonter Remonter
L'éditeur javascript - CSS - Gentoo - Tutoriaux PHP - Tutoriels PHP - Php - Breizh Blog