Actualisation d'une div

Version imprimable

08/11/2016, 15h27
vinil

Actualisation d'une div

Bonjour,

je voudrais faire un truc tout bête mais je ne trouve pas la solution et j'ai commencer le Javascript il n'y a pas longtemps donc je ne sais pas comment m'y prendre, j'ai fait un chat qui s'actualise avec Ajax, quand j’écris un nouveaux message la liste en dessous s'actualise et mon message apparait bien maintenant le probléme est que mes messages s'affiche a la suite donc au bout d'un moment la page est pleine et je voudrais que quand un nouveau message arrive la div descende comme un selecteur ou autre, comment doit-je faire sa ? en CSS ?

Merci
Cordialement
08/11/2016, 15h50
SpaceFrog

Citation:

div descende comme un selecteur ou autre

un slideDown ?
possible en css ...
https://davidwalsh.name/demo/css-slide.php

ou en jquery slideDown()
08/11/2016, 16h05
vinil

1 pièce(s) jointe(s)

Bonjour,

ceci cache la div moi je voudrais faire un truc encore plus simple, en gros les messages reçu s'affiche et la div s'agrandit comme ceci [surligner en jaune] :

Pièce jointe 224351
08/11/2016, 16h13
SpaceFrog

ben rajoute le contenu DANS la div avec innerHTML ...

Oui mais justement, voici mon code javascript:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function charger(){
 
            setTimeout(function(){
                var premierID = $('#conversation p:first').attr('id');
                $.ajax({
                    url : "/espacework/charger.php?id=" + premierID,
                    type: "GET",
                    success : function(html){
                document.innerHTML = $('#conversation').prepend(html);
                    }
                });
                charger();
            }, 1000);
        }
                charger();

et voici le fichier charger.php :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
if(!empty($_GET['id'])){ 
 
    $id = (int) $_GET['id']; // on s'assure que c'est un nombre entier
 
    // on récupère les messages ayant un id plus grand que celui donné
    $requete = $bdd->prepare('SELECT * FROM conversation WHERE id > :id ORDER BY id DESC LIMIT 0,5');
    $requete->execute(array("id" => $id));
 
    $conversation = null;
 
    // on inscrit tous les nouveaux messages dans une variable
    while($donnees = $requete->fetch()){
        $conversation .= "<p id=\"" . $donnees['id'] . "\">" . $donnees['blaze'] . " dit : " . $donnees['message'] . "</p>";
    }
 
    echo $conversation; //la variable a retourner 
 
}

donc comment retourner la variable du code php dans la div ?

heu tu mélanges un peu tout ...

pourquoi ne pas utiliser Jquery
Code:

1 2 3 4 success : function(html){ $('#conversation').prepend(html); }
suffit amplement

08/11/2016, 19h49
vinil

1 pièce(s) jointe(s)

j'utilise déjà cette commande puisque j'ai un affichage mais malgré le LIMIT 0,5 dans ma commande voila ce que sa me donne :
Pièce jointe 224371

je voudrais que les message défile dans une boite avec la bar qui descend si il y a plus de 5 message par exemple
08/11/2016, 20h00
vinil

1 pièce(s) jointe(s)

Bon c’était bien du CSS je me suis surement mal exprimé c'était "overflow" que je cherchait ! merci en tout cas ! voici le résultat que je voulais obtenir :

Pièce jointe 224374