11540 sujets

JavaScript, DOM et API Web HTML5

Bonjour
Sur le forum il y a un chat et je veux le rafraichir automatique, donc j'utilise un script qui donne satisfaction avec firefox, chrome mais pas avec IE, avec IE quand je me connecte pour la première fois tout est ok, les messages présent sont visibles, mais pas de rafraichissement auto, (ce n'est pas trop le hic) le souci est que une fois connecté il n'affiche pas les nouveaux messages, même en rafraichissant la page manuellement, il faut que je quitte la page et que je revienne pour avoir les nouveaux messages, en supprimant une ligne ça marche mais pas de rafraichissement auto, les nouveaux messages eux sont affichés avec un rafraichissement manuel.

voila le code
function getXMLHttpRequest() {
    var xhr = null;
     
    if (window.XMLHttpRequest || window.ActiveXObject) { [i]  [b]/*en enlevant cette ligne le chat sous ie ne saute plus mais ne se rafraichit pas*//[/b][/i]
        if (window.ActiveXObject) {
            try {
                xhr = new ActiveXObject("Msxml2.XMLHTTP");
            } catch(e) {
                xhr = new ActiveXObject("Microsoft.XMLHTTP");
            }
        } else {
            xhr = new XMLHttpRequest();
        }
    } else {
        alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest...");
        return null;
    }
     
    return xhr;
}
function refreshChat() 
{
	var xhr = getXMLHttpRequest(); // On récupère notre objet
	xhr.onreadystatechange = function() {
		// Si xhr reçoit des données (xhr.readyState == 4) et que son status est OK
		// alors on récupère les données (xhr.responseText) qu'on injecte entre les balises div du minichat
		if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) {
			// Remplissage des données textuelles récupérées
			document.getElementById('minichat').innerHTML = xhr.responseText;
		}
	};
 
	xhr.open("GET", "minitchat.php", true); // On ouvre une connexion en méthode GET vers minichat.php 
	xhr.send(null); // On envoie
}

var timer=setInterval("refreshChat()", 5000); // Rafraichit le minichat toute les 5s


<div name="tchatview" id='minichat' class="form2" style="padding: 2px; width: 900px; height: 150px; overflow: auto;">{%box[tchatlistemsg]%}</div>


Voilà si vous avez une idée, car là perso ça sort de mes compétences, assez limitées c'est vrai.
Merci
bonjour,

l'utilisation de bibliothèques comme jquery permet de masquer ces problèmes liés aux navigateurs, et de simplifier le code. C'est en tout cas ce que je fais car je ne maîtrise pas les spécificités des navigateurs.

Par contre rafraîchir une DIV avec un appel AJAX de type "GET" est risqué, car les requêtes de type GET sont en général mises en cache, en effet ce sont des requetes qui sont sensées appeler des ressources statiques. Si tu veux absolument utiliser un GET il faut bien maîtriser le cache. Une requete POST n'est pas mise en cache : voir les explications et est donc recommandée pour mettre à jour une DIV en boucle.
Modifié par Zebrou (17 Aug 2014 - 22:47)
Bonjour
OK merci de cette réponse, perso je ne suis pas à l'origine de ce code (pas les compétences) c'est un freelance qui me l'a implanté, mais bon je ne le vois plus et j'essaye de comprendre.
En effet j'ai du coup trouvé d'autres codes avec jquery je vais regarder tout cela de plus près ainsi que le lien que vous avez mis
Paul
Bonjour
Bon j'ai repris un autre script et je n'ai plus de souci avec IE,

<script style="text/javascript">
<!--
function addtxt(valeur1)
{
	champ1 = document.all.tchatmsg;
	champ1.value += valeur1;
}
[b]debut du scrit refrech[/b]
$(document).ready(function() {
$.ajaxSetup({ cache: false }); // This part addresses an IE bug.  without it, IE will only load the first number and will never refresh
setInterval(function() {
$('#minichat').load('http://www.motoculture-jardin.com/maison/minitchat.php');
}, 8000); // the "3000" here refers to the time to refresh the div.  it is in milliseconds.
});
//-->
</script>

Merci de votre aide
paul
avec jquery j'oublais
Modifié par paul (19 Aug 2014 - 21:59)