Forum d'entraide PHPFrance

Bonjour , j'ai un problème et j'ai vraiment tout essayé pour le résoudre mais impossible : J'apprend la programmation php,sql . Mais je me suis mis au javascript/ajax/jquery qui sont assez complexes.

Depuis peu je créer un chat et évidemment j'ai une erreur dans mon script php ou javascript ! Pourtant le formulaire est posté correctement (addMessage), et les informations sont ensuite récupérés avec getMessages (Et Firebug affiche pourtant bien les informations json récupérés par un fichier php).

Mais le problème est que rien ne s'affiche et étant débutant dans ces languages je vous demande votre aide.
Je pense que l'erreur est obligatoirement présente dans un des deux fichiers.
De plus le retour json indique peut-être un problème, et il n'est pas afffiché avec le .append() .

Voici le script javascript :

[javascript]
var url="tchatAjax.php";
var lastid=0;
var timer = setInterval(getMessages,2000)
var destinataire = "";

$(function() {
element = document.getElementById('tchat');
element.scrollTop = element.scrollHeight;
$('form').submit(function(){
var message = $("input:text").val();
if (message != "") {
clearInterval(timer);

$.ajax({
type: "POST",
url: url,
dataType: "JSON",
data: {action:"addMessage",message:message,destinataire:destinataire},
success: function(data){
if(data.erreur=="ok1"){
getMessages();
}
}
});
var message = $("input:text").val("");
timer = setInterval(getMessages,2000);
}
return false;
});
});

function getMessages(){
$.ajax({
type: "POST",
url: url,
dataType: "JSON",
data: {action:"getMessages",lastid:lastid,destinataire:destinataire},
success: function(data){
if(data.erreur=="ok2"){
$("#tchat").append(data.result);
lastid = data.lastid;
element = document.getElementById('tchat');
element.scrollTop = element.scrollHeight;
}
}
});
return false;
};
[/javascript]

Ensuite voici le php qui traite la requête ajax en json :

<?php
session_start();
require ("connect.php");
$d = array();

if(isset($_SESSION['username']) || !empty($_SESSION['username']) || isset($_POST["action"])){

	/**
	* Récupération des informations postés 
	* et de toute les variables.
	**/
	extract($_POST);
	$expediteur = mysql_real_escape_string($_SESSION['username']);	
	$destinataire = mysql_real_escape_string($destinataire);
	$date = time();
	$vue = 0;

	/**
	* Action: addMessage
	* Permet l'ajout d'un message
	**/
	if($_POST["action"]=='addMessage') {
		$message = mysql_real_escape_string($message);
		$sql = "INSERT INTO messages(expediteur,destinataire,message,date,vue) VALUES('$expediteur','$destinataire','$message','$date','$vue')";
		mysql_query($sql) or die(mysql_error());	
		$d["erreur"] = "ok1";
	}

	/**
	* Action: getMessages
	* Permet l'affichage des derniers messages
	**/
	if($_POST["action"]=='getMessages') {
		$lastid = floor($lastid);
		$sql = "SELECT * FROM messages WHERE id>$lastid AND expediteur='$expediteur' AND destinataire='$destinataire' OR id>$lastid AND expediteur='$destinataire' AND destinataire='$expediteur' ORDER BY date ASC";
		$req = mysql_query($sql) or die(mysql_error());
		$d["result"] = "";
		$d["lastid"] = $lastid;
		while($data = mysql_fetch_assoc($req)){
			$d["result"] .= '<p><strong>'.$data['expediteur'].'</strong> ('.date("d/m/Y H:i:s",$data["date"]).') : <br/>'.htmlspecialchars($data['message']).'</p>';
			$d["lastid"] = $data["id"];
		}
		$d["erreur"]="ok2";
	}
}
	/** Transmission des informations en JSON **/
	echo json_encode($d);

?>

Et voici la réponse du serveur pour face à la requête ajax addMessage (En json) :
Pour moi il n'y a aucun problème dans cette requête puisque le message est postée et le message ok1 est bien présent.

Là c'est la seconde réponse json pour la récupération du message avec getMessages :
C'est ici que ça pose problème : Le json semble correct mais le nouveau message récupéré ici n'est pas affiché et en plus Firebug m'affiche ce résultat json en boucle !

Aidez-moi svp cela fait bien plus d'un mois que je traque cette erreur !

Le json en boucle c'est normal, c'est que fait ton code.
Il interroge continuellement ta base de données.
Il faut que tu ne renvois rien si le dernier id est identique.

Concernant le problème d'affichage si Firebug affiche le json le append doit avoir lieu.
Mais le fais-tu sur le bon élément HTML ?
Tu peux regarder dans l'onglet HTML le code ajouté en live pour confirmer cela.

Bonjour, je peut te confirmer que json devrait être affiché sur la bonne div ! Mais malheureusement, Firebug n'affiche pas le append() en live comme tu l'as dis, donc la fonction n'est pas lancé pas lieu.

J'ai pu aussi constater qu'un simple alert() dans une des deux requêtes ajax du javascript n'est même pas executé comme la fonction append()
Quand j'active la fonction de Firebug "Arrêter à chaque erreur", Firebug me dis : JSON.parse: unexpected character

Dans la fonction du success qu'obtiens-tu en faisant un :
[javascript]console.log(data);[/javascript]
Ou même un alert si tu préfères.

Rebonjour, justement là ça coince ! Toutes les fonctions telles que alert(); console.log(); ne sont pas executés pour une raison inconnue !
Ces fonctions ne sont pas lancées si elles sont présentes dans une des deux requêtes $.ajax()

Exemple sur getMessages :
[javascript]
function getMessages(){
$.ajax({
type: "POST",
url: url,
dataType: "JSON",
data: {action:"getMessages",lastid:lastid,destinataire:destinataire},
success: function(data){
if(data.erreur=="ok2"){
alert('Hello World !'); // ICI, la fonction n'est pas lancée
$("#message").append(data.result);
lastid = data.lastid;
}
}
});
return false;
};
[/javascript]

Le problème doit se trouver autre part : Si le append(); ou alert(); ne fonctionne pas c'est tout simplement parce qu'il n'est pas exécuté.

En tout cas je te remercie pour ton soutient !

Places le avant le if...

Non, ça ne change rien . Et en plus aucune erreur n'est affiché dans firebug. Toute fonction placée dans la première ou la seconde requête ajax n'est pas lançée.

Erreur

Je pencherai donc par un erreur de syntaxe si plus aucune fonction JS n'est exécutée.
Regardes la console au chargement de la page.

Au chargement de la page, le getMessages est bien lancé toute les deux secondes. Mais aucun message d'erreur dans la console.

Mais il y a une erreur, (Sans que je n'écrive un message) elle se trouve dans l'onglet script mais indique cette erreur dans jquery.js :

http://zupimages.net/up/14/03/t01l.png

C'est une erreur JSON.parse , bien qu'elle soit pointée vers le jquery, cette erreur est bien provoquée par mon script !
Si tu sais quoi faire, peut-être que mon script pourra enfin battre des ailes
Je n'ai malheureusement aucun autre signe d'un problème. Merci xTG

Tentes de supprimer les balises HTML dans ton json pour voir si cela ne viendrait pas de là.

Non, toujours pas ! Même si je place ceci le append() n'est pas lancé :

$d["result"] .= "Coucou";

MAIS, j'ai remarqué un truc très inhabituel ! C'est que quand je rentre plusieurs messages sans réactualiser la page, cela donne ce json :
Le nouveau message est ajouté au result ce qui donne le json au-dessus ! Je suis sûr que ce n'est pas normal, et c'est peut-être la cause de l'erreur JSON.parse
De plus le json est toujours reçu en boucle ...

Le json en boucle c'est normal, c'est que fait ton code.
Il interroge continuellement ta base de données.
Il faut que tu ne renvois rien si le dernier id est identique.

$d["result"] .= "Coucou";

Tu fais une concaténation c'est donc normal.
Ta requête doit renvoyer deux résultats.

Le json que tu nous postes est tout à fait valide.
Va falloir regarder si ton script ne renvoie pas autre chose.
Que donnes l'entête de la requête Ajax ?
Fais un formulaire renseignant les champs que tu utilises dans ta requête Ajax et fais le pointer vers ton script.
Cela te permettra d'arriver sur la page de génération de ton json.
En regardant le code source généré par le navigateur tu pourras vérifier que tu n'as pas des caractères bizarres autour ou dans ton json.

Que veut tu dire par entête de la requête ajax, est ce de la première ou la deuxième requête ?

J'ai essayé de pointé mon form vers le php mais rien ne se passe...
Le formuaire ci-dessous qui pointe vers le tchatAjax.php ne renvoie rien :

<form method='POST' action='tchatAjax.php'>
<textarea id='entree' placeholder='Ecrivez-ici...'></textarea>
</form>

Ou faut-il mettre un onClick dans le textarea ?
Comment faut-il faire ?
Merci xTG

Voici ce qui est envoyé dans la requête Ajax.
Donc tu dois faire un formulaire avec ces trois champs (action, lastif, destinataire).
Et pour poster un formulaire il te faut un bouton submit...
De plus si ce n'est pas du HTML5 il faut utiliser l'attribut name plutôt que id dans tes champs.

C'est bon j'ai résolu le problème ! Mais en faite mon bug était simplement tout bête

J'avais une ligne qui déconnait car la valeur était vide et cela bloquait mon script :
[javascript]var lastid = <?php echo $data['id'];?>;[/javascript]
J'avoue que je ne sais pas comment j'ai réussi à faire cette erreur, il fallait simplement mettre :

$id = $data['id'];
if($id==""){$id=0;}

Et voilà, merci xTG de m'avoir soutenu ! =D>