[AJAX] Page de commentaire ajax

**molo1987** · 01/04/2011, 11h39

Bonjour a tous,

je suis debutant ,je voulais faire une page de commentaie genre par exemple 'commentaire sur facebook', le probleme ici c que ma requete sur ajax s'envoie normalement tout fonctionne mais pour avoir le dernier commentaire que j'ai saisi je dois actualiser ma page pour l'avoir, sinon si je mets l'affichage via ajax j'ai un autre probleme c que lorsque j'accede pemier fois sur ma page je l a trouve vide donc je suis obligé a saisir quelque choses pour que tout les donnés s'affichent ;j'éspere que j'etais claire
voila mes deux pages :

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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
 
<?php
    mysql_connect('localhost', 'momo', 'momo')or die(mysql_error());
    mysql_select_db('test') or die(mysql_error());
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
    <head>
        <script type="text/javascript" src="xmlhttprequest.js"> </script>
        <script type="text/javascript">
 
            function request() {
 
	            var xhr = getXMLHttpRequest();
 
	            xhr.onreadystatechange = function() {
		        if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) {
			    readData(xhr.responseText);
                            document.getElementById("loader").style.display = "none";
		        } else if (xhr.readyState < 4) {
			    document.getElementById("loader").style.display = "inline";
		        }
	            };
 
	            xhr.open("POST","blog_blog.php",true);
                    xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
                    var valeur = document.getElementById("text").value;
	            xhr.send("variable="+valeur);
            }
 
            function readData(oData) {
	           oData;
            }
 
        </script>
    </head>
 
    <body>
 
 
        <div id="loader" style="display:none"><img src="image.gif" alt="Patienter svp" /> </div>
        <div id="comment" style="border: 1px solid #333; width: 400px; padding:20px; margin:0 auto;margin-top:10px; ">
 
	    <?php
                 
                $query = "SELECT prenom FROM reference";
                $res = mysql_query($query) or die(mysql_error());
                while($row = mysql_fetch_assoc($res)){
                        echo "<div style='background:red; margin:10px;'>".$row["prenom"]."</div>";
                }
            ?>
	</div>
 
 
                 <input type="text" name="text" id="text"  onclick='request()'/>
 
 
 
 
    </body>
             <?php
                 mysql_close();
             ?>
</html>

et l'autre :

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
 
<?php
   
    
     if(isset($_POST['variable'])){
                mysql_connect("localhost","momo","momo");
                mysql_select_db("test");
                $var = $_POST["variable"];
                $e = "INSERT INTO reference (id, nom, prenom) VALUES (null,'samia','$var')";
                $r = mysql_query($e) or die(mysql_error());
               
                
        }
          
 
 
?>

**gototog** · 01/04/2011, 13h46

Structure tes phrases(ta phrase enfait :p) et vide ton code de superflu (css dans les balises etc..) on les comprendra mieux.

si je récapitule ton actuelle page ca donnerait grosso modo
<scriptajax>
<page>
----------Loader.gif--------

----------Comment---------
Nom1_reçut par requete
Nom2_reçut par requete
...
----------------------------

---Bouton -> AJAX ajout de samia dans les noms en base de donnée---

Pour résoudre ton problème d'actualisation, il faut que ton script ajax renvoie la liste des commentaires.

Par exemple, dans ton fichier php, après avoir insérer ton nouveau prénom, tu renvoie la nouvelle liste de commentaires (la meme requete que celle que tu as au milieu de ta page)

Dans ton script ajax, lorsque la requete est terminé(xhr.readyState == 4), tu charge ta réponse dans le gros div des commentaire:

document.getElementById('Le_nom_de_ton_DIV_des_commentaires').innerHTML = xhr.responseText;

**molo1987** · 01/04/2011, 21h48

bon si je le fais comme ça, ça donnerait rien lorsque j'accède la première fois car je dois cliquer sur le bouton car la requête select est la deuxième page.

**nadox** · 01/04/2011, 22h30

Bonsoir,

A quoi sert cette fonction ?

Code javascript :

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

1
2
3
4
 
            function readData(oData) {
	           oData;
            }

gototog a raison, il faut que ta page "blog_blog.php" te renvoie la nouvelle liste, mais il faut quand même garder le select dans la page appelante pour le premier affichage.

**molo1987** · 01/04/2011, 22h47

Envoyé par nadox

Bonsoir,

A quoi sert cette fonction ?

Code javascript :

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

1
2
3
4
 
            function readData(oData) {
	           oData;
            }

gototog a raison, il faut que ta page "blog_blog.php" te renvoie la nouvelle liste, mais il faut quand même garder le select dans la page appelante pour le premier affichage.

cette fonction je l'ai mis comme ça pour ne pas avoir une resultat de la page blog_blog sinon j'ai fait comme vous m'avez dit mais c pas ça ce que je veux ,je veux ce que j'ecris il reste toujours dans ma page; pour vous expliquer plus voila un eemple que j'ai touvé http://demos.9lessons.info/comment_system.php normalement ça ce que j'ai fait et ce que vous m'avez demandé de faire mais enfin lorsque j'actualie ou j'accede un deuxieme fois dans ma page tout ce que j'ai mis comme commentaire disparait mais moi je veux qu'il reste .

**nadox** · 01/04/2011, 23h38

Montre nous ton nouveau code, parce que là... difficile de voir ce qui ne va pas !

Tu as bien tes nouvelles données dans la base de données?

[AJAX] Page de commentaire ajax

AJAX

Discussions similaires

Partager

Partager