Rafraichir une frame

Version imprimable

02/06/2009, 19h53
malabarbe

Rafraichir une frame

Bonjour;

Comment rafraichir ma frame de gauche qui
contiens mon menu et l'affichage du compteur
de visites (nombre contenu dans un fichier txt)

J'ai effectué des tests, le compteur se met a
jour automatiquement

Le soucis, c'est que toute la navigation s'effectue
dans la frame de droite et le raffraichissement
agit également sur celle-ci.

Comment actualiser le compteur sans interférer
sur les autres frames ?

Merci de m'aider

Bonjour,
Pourquoi ne pas utiliser AJAX pour ne rafraichir que le compteur et non pas toute la Frame.

Code:

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
function createXHR() 
{
    var request = null;
        try {
            request = new ActiveXObject('Msxml2.XMLHTTP');
        }
        catch (err2) {
            try {
                request = new ActiveXObject('Microsoft.XMLHTTP');
            }
            catch (err3) {
		try {
			request = new XMLHttpRequest();
		}
		catch (err1) 
		{
			return request;
		}
            }
        }
    return request;
}
function compter() 
{
	var xhr=createXHR();
	xhr.open("GET", "compteur.txt",true);
	xhr.onreadystatechange = function()
		{ 
		if (xhr.readyState == 4 && xhr.status == 200) 
			{
				document.getElementById('compteur').innerHTML=xhr.responseText;
			}
		}
	xhr.send(null); 
}
setInterval('compter()',10000);

Code:

<p id="compteur"></p>

03/06/2009, 10h53
malabarbe
Bonjour andry.aime,

Merci de m'avoir répondu
Exact, ce n'est que le compteur que je veut raffraichir

Mais ne connaissant pas l'Ajax, comment intégrer a
votre code l'appel de mon compteur en PHP ?

Mon code pour lire et afficher le compteur en PHP
Code:

1 2 3 4 5 6 7 8 9 <?PHP $file = fopen("stats/compteur_v.txt","r+"); $num = fgets($file,4096); fclose($file); echo '</center></b>'; echo $num; ?>
A vous lire
03/06/2009, 12h46
andry.aime

Tu peux directement appeler le fichier txt.

Code:

xhr.open("GET", "stats/compteur_v.txt",true);

Ou le fichier php en modifiant l'adresse dans le second paramètre de xhr.open
03/06/2009, 12h59
malabarbe
ok pour la modif de xhr.open (chemin du fichier)

Mais quelle instruction pour centrer et afficher
le compteur car je ne comprends pas le code suivant
Code:

1 2 <p id="compteur"></p>
A vous lire
03/06/2009, 13h09
andry.aime

C'est dans ce paragraphe qu'on va mettre le résultat du requête ajax.

Citation:

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

Tu le mets à l'endroit où tu veux placer le compteur, centrer avec css ou la balise center.

Le script tourne sans erreur mais lecompteur n'est pas affiché !

Code:

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
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> Test Compteur </TITLE>
 
<BODY>
 
<script type="text/javascript" src="ajax2.js">
function createXHR() 
{
    var request = null;
        try {
            request = new ActiveXObject('Msxml2.XMLHTTP');
        }
        catch (err2) {
            try {
                request = new ActiveXObject('Microsoft.XMLHTTP');
            }
            catch (err3) {
		try {
			request = new XMLHttpRequest();
		}
		catch (err1) 
		{
			return request;
		}
            }
        }
    return request;
}
function compter() 
{
	var xhr=createXHR();
    xhr.open("GET", "stats/compteur_v.txt",true);
	xhr.onreadystatechange = function()
		{ 
		if (xhr.readyState == 4 && xhr.status == 200) 
			{
				document.getElementById('compteur').innerHTML=xhr.responseText;
			}
		}
	xhr.send(null); 
}
setInterval('compter()',10000);
</script>
 
<?php
echo "Visiteurs : ";
?>
 
<CENTER>
<p id="compteur"></p>
 
</BODY>
</HTML>

1- Le code javascript doit être dans le head.
2- Les balises head et center ne sont pas fermé.

Code:

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
<html>
<head>
<TITLE> Test Compteur </TITLE>
 <script type="text/javascript" src="ajax2.js">
function createXHR() 
{
    var request = null;
        try {
            request = new ActiveXObject('Msxml2.XMLHTTP');
        }
        catch (err2) {
            try {
                request = new ActiveXObject('Microsoft.XMLHTTP');
            }
            catch (err3) {
		try {
			request = new XMLHttpRequest();
		}
		catch (err1) 
		{
			return request;
		}
            }
        }
    return request;
}
function compter() 
{
	var xhr=createXHR();
    xhr.open("GET", "stats/compteur_v.txt",true);
	xhr.onreadystatechange = function()
		{ 
		if (xhr.readyState == 4 && xhr.status == 200) 
			{
				document.getElementById('compteur').innerHTML=xhr.responseText;
			}
		}
	xhr.send(null); 
}
setInterval('compter()',10000);
</script>
</head>
<BODY onload="compter()">
<?php
echo "Visiteurs : ";
?>
<CENTER>
<p id="compteur"></p>
</center> 
</BODY>
</HTML>

03/06/2009, 14h09
malabarbe
Après modif du code :
Pas d'affichage erreur ligne 43
Code:

1 2 <BODY onload="compter()">
Seul le mot Visiteurs : s'affiche
03/06/2009, 14h20
nod__

Citation:

Envoyé par andry.aime

1- Le code javascript doit être dans le head.

Je peux contester ? Vu que la réputation de la team javascript de chez Yahoo n'est plus a faire et qu'ils disent explicitement de mettre les scripts js en fin de page. Je me demande pour quelles raisons on doit mettre les <script> dans le head, sachant que la spec HTML n'interdit aucun des deux ?

Best Practices for Speeding Up Your Web Site
03/06/2009, 20h09
malabarbe

J'ai refait un test en déplacant le fichier
compteur_v.txt dans la racine du serveur, mais le
résultat est le mème !

Le compteur ne s'affiche pas
03/06/2009, 23h02
malabarbe
Re des tests
j'ai remplacé :
Code:

1 2 <SCRIPT type="text/javascript" src="ajax2.js">
Par :
Code:

1 2 <SCRIPT language="javascript">
Maintenant, le compteur s'affiche bien
Mais il ne s'actualise pas

Par contre, si j'efface les fichiers temporaires
du navigateur, le compteur s'actualise.
mais plus après

Si je fait actualiser dans le navigateur, idem, pas d'actualisation

Je touche au but, merci de votre aide

C'est un problème de cache.
Essaye avec

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function compter() 
{
	var xhr=createXHR();
	var a= new Date();
    xhr.open("GET", "stats/compteur_v.txt?time="+a,true);
	xhr.onreadystatechange = function()
		{ 
		if (xhr.readyState == 4 && xhr.status == 200) 
			{
				document.getElementById('compteur').innerHTML=xhr.responseText;
			}
		}
	xhr.send(null); 
}

04/06/2009, 12h15
malabarbe

OK,

Cela tourne sous XP mais pas en VISTA ?
04/06/2009, 14h09
Macmillenium
Bonjour,

Citation:

Envoyé par nod__

Je peux contester ? Vu que la réputation de la team javascript de chez Yahoo n'est plus a faire et qu'ils disent explicitement de mettre les scripts js en fin de page.

Effectivement et ce n'est pas parce que Yahoo le recommande ;)
Le fait d'appeler les scripts à la fin de la page permet de s'assurer que :
- Le navigateur a parsé le document;
- Tous les objets ont été créés;
- Toutes les requêtes HTTP ont été exécutées;
C'est donc recommandé pour des raisons de performance et d'accessibilité.

Citation:

Envoyé par nod__

Je me demande pour quelles raisons on doit mettre les <script> dans le head, sachant que la spec HTML n'interdit aucun des deux ?

C'est juste la sémantique ;)
05/06/2009, 11h17
malabarbe

Bonjour,

Une autre méthode existerai-t'elle ?

Peut-être en PHP ?

Je fait mes tests sous XP, mais le vrai serveur est sous VISTA !

Nous étions si près du but

Encore un petit coup de main SVP

Bonne journée à tous
05/06/2009, 11h43
andry.aime

Tu l'as déjà testé sous Vista?
ça devrait fonctionner.
05/06/2009, 13h40
malabarbe

Oui, j'ai testé sous VISTA

Pas d'erreur, mais l'actualisation du compteur
ne se fait pas.

Si je fais actualiser la page oui j'ai l'actualisation
du compteur mais relance le site en perdant la
navigation sur celui-ci

J'ai fait un petit test en PHP en testant le changement
de minutes, mais c'est dans une boucle infinie et
cela épuise mes recources système !