Salut,
je rencontre encore un souci avec mon script de shoutbox, en faite j'essais avec bien du mal de faire un refresh toutes les 5 seconde de ma shoutbox mais rien fonctionne ...

voilà mon script (le même que mon précédent post ):

[javascript]
$(document).ready(function(){
//global vars
var inputUser = $("#pseudo");
var inputMessage = $("#mess");
var loading = $("#loading");
var messageList = $(".content > ul");

//functions
function updateShoutbox(){
//just for the fade effect
messageList.hide();
loading.fadeIn();
//send the post to shoutbox.php
$.ajax({
type: "POST", url: "shoutbox.php", data: "action=update",
complete: function(data){
loading.fadeOut();
messageList.html(data.responseText);
messageList.fadeIn(2000);
}
});
}
//check if all fields are filled
function checkShout(){
if(inputUser.attr("value") && inputMessage.attr("value"))
return true;
else
return false;
}

//Load for the first time the shoutbox data
updateShoutbox();

//on submit event
$("#shout").submit(function(){
if(checkShout()){
var pseudo = inputUser.attr("value");
var mess = inputMessage.attr("value");
//we deactivate submit button while sending
$("#send").attr({ disabled:true, value:"Sending..." });
$("#send").blur();
//send the post to shoutbox.php
$.ajax({
type: "POST", url: "shoutbox.php", data: "action=insert&pseudo=" + pseudo + "&mess=" + mess,
complete: function(data){
messageList.html(data.responseText);
updateShoutbox();
//reactivate the send button
$("#send").attr({ disabled:false, value:"Envoyer !" });
}
});
}
else alert("Merci d'écrire un message!");
//we prevent the refresh of the page after submitting the form
return false;
});
});
[/javascript]

et voilà ce que j'ai testé :

[javascript]
function update(){
$.ajax({
type: "POST", url: "shoutbox.php", data: "action=update",
complete: function(data){
loading.remove();
messageList.html(data.responseText);
}
});
setTimeout('update()', 5000);
}
[/javascript]

Mais étant un gros noub en javascript, ça ne fonctionne pas...
Pouvez-vous me donner des indices pour que je tente de faire fonctionner ce script ?
Merci

Salut,
il faut que tu lances ta fonction depuis l'extérieur en déplaçant ton setTimeout.

Voici ce que tu pourrais faire, j'ai commenté pour t'en faciliter la compréhension :
[javascript]/**
* La fonction de rafraichissement elle-même
*/
var update = function()
{
$.ajax({
type: "POST",
url: "shoutbox.php",
data: "action=update",
complete: function(data)
{
loading.remove();
messageList.html(data.responseText);
}
});
};
/**
* Une variable représentant l'évènement de rafraichissement
*/
var refresh = null;
/**
* Une fonction pour lancer le rafraichissement automatique
*/
var activerRefreshAuto = function(duree)
{
refresh = setTimeout('update', duree);
};
/**
* Une fonction pour arrêter le rafraichissement automatique
*/
var desactiverRefreshAuto = function()
{
clearTimeout(refresh);
};
/**
* On lance le rafraichissement en indiquant la durée entre chaque exécution.
*/
activerRefreshAuto(5000);
[/javascript]
Note l'utilisation d'une variable refresh qui servira en quelque sorte de gestionnaire de TimeOut et l'utilisation de fonction pour lancer ou arrêter le processus. Et observe également que la fonction qui lance le processus est paramétrée : ça te permettra de modifier le délai de rafraichissement si besoin est depuis au appel ailleurs dans ton code si besoin est.

Salut,
merci pour ta réponse.
Je viens de tester le bout de code que tu a fais mais ça ne fonctionne pas . En faite je l'ai placé directement dans ma page ou ce trouve ma shoutbox mais celle-ci ne se rafraichi pas.
Quand tu dis

il faut que tu lances ta fonction depuis l'extérieur en déplaçant ton setTimeout.

celle-doit être en dehors de mon script que j'ai posté plus haut?

Non, je veux dire en dehors de la fonction qui est appelée, donc ici en dehors de la fonction update(). Or dans ton code original, tu effectuais l'appel depuis la fonction elle-même, tout ce qu'il faut pour créer une boucle exponentielle puisque lançant un nouveau timeout à chaque tour en plus de ceux lancés au tour précédent... et on plante bien un navigateur avec ça

Relis le code proposé en t'attardant sur les commentaires que j'ai mis, ils sont aussi importants que le code lui-même.

bonjour,

cyrano t'as donnée la solution optimale, tu doit ajouter ton code dans la fonction "update" dans la section "complete" de l'appel ajax, plus simplement la logique du mise a jours de l'interface tu la met simplement dans la "complete" d'ajax.

si tout va bien tu peut aussi ajouté un flag pour vérifier s'il y a modification dans la variable de retour "data" tu peut utilisé MD5 et la tu compare la version précédente avec l'actuelle s'il sont égaux il y a pas modification donc c'est pas la peine de manipuler le DOM.

Bon Codage,