[AJAX] Rafraichir une partie de la page toutes les secondes

**identifiant_bidon** · 13/03/2011, 00h57

Bonjour,

Voici mon problème.
Je dispose d'une page avec une table dans laquelle j'affiche un nombre aléatoire. Je voudrais faire en sorte que la cellule dans laquelle est affiché ce nombre se recharge toutes les secondes. Ne connaissant pas Ajax pour le moment, je ne sais pas du tout comment faire ça.

Voici mon code pour l'instant:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<html>
<head>
	<script language="javascript" type="text/javascript">
		URL = "http://localhost/Test/test_Ajax/test.php";
		function rafraichir() {
				if (window.XMLHttpRequest) xhr = new XMLHttpRequest();
				else if (window.ActiveXObject) xhr = new ActiveXObject('Microsoft.XMLHTTP');
				else alert('JavaScript : votre navigateur ne supporte pas les objets XMLHttpRequest...');
				xhr.open('GET',URL,true);
				xhr.onreadystatechange = ajaxReponse;
				xhr.send(null);
		}
 
		function ajaxReponse() {
				if (xhr.readyState == 4) {
						document.getElementById("test_refresh",true).innerHTML=xhr.responseText; 
						var timer=setTimeout("rafraichir()",1000); 
				}
		}
</script>
 
 
 
</head>
<body onLoad="javascript:rafraichir();">
<table>
	<tr>
		<td id="test_refresh">
			<?php 
                        $nb_min = 1;
                        $nb_max = 100;
                        $nombre = mt_rand($nb_min,$nb_max);
                        
                        echo $nombre;
                        ?>
		</td>
	</tr>
</table>			
</body>
</html>

Merci à toute personne qui pourra m'indiquer comment régler mon problème.

A+

**Nesmontou** · 13/03/2011, 11h27

Bonjour,

Tu peux utiliser la fonction setInterval : http://javascript.developpez.com/faq...e=date#Horloge

Bon développement

**identifiant_bidon** · 13/03/2011, 12h04

Yeeees, merci beaucoup Nesmontou !!

Ça marche bien comme je veux !!!!
(et dire que mon problème se trouvait seulement là !!!

)

**identifiant_bidon** · 13/03/2011, 17h23

J'crois que j'ai parlé un peu trop vite en fait. Le comportement est vraiment bizarre au bout de quelques secondes. Une partie de la page est "doublée".

Cette page est une page de test (je découvre Ajax) mais lorsque je la met dans ma "vraie" page, le rafraichissement ne se fait plus.

Voici mon code, si quelqu'un pouvait m'expliquer ce qui se passe, ce serait sympa.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<html>
<head>
	<script language="javascript" type="text/javascript">
		URL = "http://localhost/Test/test_Ajax/test.php";
		function rafraichir() {
				if (window.XMLHttpRequest) xhr = new XMLHttpRequest();
				else if (window.ActiveXObject) xhr = new ActiveXObject('Microsoft.XMLHTTP');
				else alert('JavaScript : votre navigateur ne supporte pas les objets XMLHttpRequest...');
				xhr.open('GET',URL,true);
				xhr.onreadystatechange = ajaxReponse;
				xhr.send(null);
		}
 
		function ajaxReponse() {
				if (xhr.readyState == 4) {
						document.getElementById("test_refresh",true).innerHTML=xhr.responseText; 
 
 
 
 
						var timer=setInterval("rafraichir()",1000); 
				}
		}
</script>
</head>
<body onLoad="javascript:rafraichir();">
<table>
	<tr>
		<td id="test_refresh">
			<?php 
                        $nb_min = 1;
                        $nb_max = 100;
                        $nombre = mt_rand($nb_min,$nb_max);
                        
                        echo $nombre;
                        ?>
		</td>
	</tr>
</table>	
ceci est une première phrase<br/>ceci est une seconde phrase
<div style="position:absolute; top:100px; left:200px; height:100px; width:200px; border:1px solid #000000">
div test
</div>
</body>
</html>

Merci beaucoup

**Bovino** · 14/03/2011, 12h08

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById("test_refresh",true)

c'est quoi ce paramètre true ?

**identifiant_bidon** · 14/03/2011, 14h25

Ben je t'avouerai que je sais pas trop Bovino. C'est un code que j'ai récupéré à la base sur le net. C'est peut-être ça qui fait que cela fait n'importe quoi. Je vais essayer ce soir.

Merci

[AJAX] Rafraichir une partie de la page toutes les secondes

AJAX

Vue hybride

Discussions similaires

Partager

Partager