Sujet Précédent Sujet Suivant

Rafraichir une partie du code source.

Résolu/Fermé
informatiquetech Messages postés 225 Date d'inscription mercredi 14 janvier 2015 Statut Membre Dernière intervention 29 février 2016 - Modifié par informatiquetech le 26/09/2015 à 21:09
informatiquetech Messages postés 225 Date d'inscription mercredi 14 janvier 2015 Statut Membre Dernière intervention 29 février 2016 - 28 sept. 2015 à 14:16
Salut tout le monde, j'ai créé un minichat en php et mysql, mon code marche très bien, mais le problème c'est que le visiteur doit actualiser sa page pour voir les nouveaux messages, ce que je veux c'est actualiser la partie où se trouvent les messages chaque 3 secondes, non pas la page car si je le fais le visiteur perdera son formulaire en l'écrivant. Comment faire,? sinon avez vous d'autres propositions?
Voici la page index.php: 
<!DOCTYPE html>
<html>
 <head>
  <meta charset="UTF-8">
  <title>ENGLISH-CHAT</title>
  <style>
   form{text-align:center;}
   div{margin:3px;}
   label{color:red;font-weight:bold;}
   nav{display:inline-block;color:purple;font-weight:bold;}
  </style>
 </head>
 <body>
  <form method="POST" action="traitement.php">
   <div><label>PSEUDO:  <input type="text" name="pseudo" ></label></div>
   <div><label>MESSAGE:  <input type="text" name="message" ></label></div>
   <div><input type="submit" value="OK"><input type="reset" value="RESET"></div>
  </form>
  <div id="resultat">  <?php
  $base = new PDO(mysql:host=hostname;dbname=db;charset=utf8;', 'pseudo', 'pass');
  $result = $base->query('SELECT pseudo,message FROM chat ORDER BY ID DESC');
  while($chat = $result->fetch())
  {
   echo '<p><nav>'. $chat['pseudo'] .': </nav> '. $chat['message'] .'</p>';
  }
  ?>
  </div>
 </body>
</html>

Voici la page traitement.php: 
<?php
 $base = new PDO('mysql:host=hostname;dbname=db;charset=utf8;', 'pseudo', 'pass');
 $prepare= $base->prepare('INSERT INTO chat(pseudo,message) VALUES(?, ?)');
 $prepare ->execute(array($_POST['pseudo'], $_POST['message']));
 header('Location:index.php');
?>

Merci pour vos réponses.
A voir également:

1 réponse

Réponse 1 / 1
nicelife90 Messages postés 615 Date d'inscription vendredi 24 septembre 2010 Statut Membre Dernière intervention 10 avril 2018 151
28 sept. 2015 à 01:02
Bonjour,

Je te conseil d'utiliser AJAX.

Pour commencer tu dois créé un fichier PHP supplémentaire ex : get_chat.php

Dans ce fichier tu fais la requête sur ta base de données comme tu le fais actuellement. 

 <?php
  $base = new PDO(mysql:host=hostname;dbname=db;charset=utf8;', 'pseudo', 'pass');
  $result = $base->query('SELECT pseudo,message FROM chat ORDER BY ID DESC');
  while($chat = $result->fetch())
  {
   echo '<p><nav>'. $chat['pseudo'] .': </nav> '. $chat['message'] .'</p>';
  }
  ?>


Par contre au lieu de faire echo dans ta boucle tu enregistre le contenu dans une variable.

Ex: 

$chat_content = NULL;
while($chat = $result->fetch()) {
     $chat_content .= '<p><nav>'. $chat['pseudo'] .': </nav> '. $chat['message'] .'</p>';
}


Ensuite tu retourne un json avec le contenue de cette variable.

Ex: 

//PREPARE JSON ARRAY
$json = array(
	"chat" => $chat_content,
);
	
//RETURN JSON
header('Content-Type: application/json');
echo json_encode($json);


Ensuite à l'aide de AJAX de JQUERY tu peux récupérer le contenue de ce fichier autant de fois que tu veux sans recharger ta page.

Ex:

Dans la balise head tu ajoute jquery : 

<head>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
</head>


Ensuite au lieu d'utiliser ce code : 

<div id="resultat">  <?php
  $base = new PDO(mysql:host=hostname;dbname=db;charset=utf8;', 'pseudo', 'pass');
  $result = $base->query('SELECT pseudo,message FROM chat ORDER BY ID DESC');
  while($chat = $result->fetch())
  {
   echo '<p><nav>'. $chat['pseudo'] .': </nav> '. $chat['message'] .'</p>';
  }
  ?>
  </div>


Tu utilise AJAX : 

<div id="resultat"></div>


<script type="text/javascript">
// <![CDATA[
	function refresh_chat() {
		$.get( "chemin_vers_le_fichier/get_chat.php", function(data) {
			$("#resultat" ).html(data.chat);
		});
	}
    $(function() { window.setInterval("refresh_chat()", 3000); });
	refresh_chat();
// ]]>
</script>



De cette façon ton chat est automatiquement mis à jours chaque 3 secondes.

Bonne chance!
1
nicelife90 Messages postés 615 Date d'inscription vendredi 24 septembre 2010 Statut Membre Dernière intervention 10 avril 2018 151
28 sept. 2015 à 01:07
Si tu veux faire encore mieux mais un peux plus compliquer je te conseil d'utiliser angular.js et node.js pour faire ce projet.
0
informatiquetech Messages postés 225 Date d'inscription mercredi 14 janvier 2015 Statut Membre Dernière intervention 29 février 2016 6 > nicelife90 Messages postés 615 Date d'inscription vendredi 24 septembre 2010 Statut Membre Dernière intervention 10 avril 2018
28 sept. 2015 à 14:16
Merci beaucoup je marque comme meilleur réponse et résolu.
0

Discussions similaires

Pokémon X et Y : comment effacer une partie ?
PokéFan -
yoshiedu13 -

49 réponses
sertissage des cables rj45
lekludo -
brupala -

7 réponses
Code de renvoi d'appel : Ooredo, Mobilis...
midoou07 -
Camille -

13 réponses