Executer une requete au bout de 30 secondes

Version imprimable

Bonjour

Je voudrais faire une sorte d'attente avant d'executer une requet . Je m'explique , j'ai une page , ou est afficher un décompte de 30 sec , au bout de ces 30 secondes , je voudrais pouvoir executer une requet HTML ou Php .

Voila le code que j'ai commencé :
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 script type="text/javascript"> var valeur_origine = 30; var valeur = valeur_origine var x; function Init() { window.document.getElementById('compteur').value=valeur; x = window.setInterval('Decompte()', 1000); } function Decompte() { ((valeur > 0)&&( ! window.document.getElementById('MaCheck').checked)) ? (window.document.getElementById('compteur').value = --valeur) : (window.clearInterval(x)); } function Relance(elem) { if( ! elem.checked ) x= window.setInterval('Decompte()', 1000); } function ResetCompteur() { valeur = valeur_origine; window.document.getElementById('MaCheck').checked = false; window.clearInterval(x) Init(); } window.onload = Init; </script>
Ensuite , si les 30 secondes sont écouler je voudrais exécuter une requête HTML , mais sans recharger la page car ça recommencerais le chargement du compteur , est-ce possible ?

16/03/2011, 16h50
andry.aime

Bonsoir,

Html est une langage statique, donc ne peut rien faire.
Si tu veux lancer une requête php, utilise AJAX.

A+.
16/03/2011, 17h47
max1395

Merci de votre réponse , et comment je peux faire ça ?
16/03/2011, 17h49
andry.aime

Citation:

Envoyé par max1395

Merci de votre réponse , et comment je peux faire ça ?

En lisant le tuto et commencer à faire une adaptation avec ton besoin :ccool:.
16/03/2011, 18h01
max1395

Merci mais je n'ai pas le temps de lire tous le tuto d'Ajax , surtout que je connais rien au javascript et au langages qui si rapport , il n'y aura pas un autre moyens , vous pouvez pas m'expliquer ? Merci
16/03/2011, 18h08
andry.aime

Citation:

Envoyé par max1395

Merci mais je n'ai pas le temps de lire tous le tuto d'Ajax

Attend, je vais le lire pour toi :ccool:.

Citation:

Envoyé par max1395

, surtout que je connais rien au javascript et au langages qui si rapport , il n'y aura pas un autre moyens , vous pouvez pas m'expliquer ? Merci

Je ne connais pas d'autre moyen.

A+.
16/03/2011, 18h14
max1395

non mais il n'y aurais pas un tuto qui va directement a ce que je cherche ? ^^
16/03/2011, 18h44
andry.aime

Citation:

Envoyé par max1395

non mais il n'y aurais pas un tuto qui va directement a ce que je cherche ? ^^

Si, il y a ici. Tu lances seulement la requête ajax dans un setTimeout.

A+.
16/03/2011, 18h57
max1395

Ok je vais lire Merci

Alors ça avance ?

Je t'ai fait un exemple pour mieux illustrer le principe :

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
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans titre</title>
<script type="text/javascript">
<!-- 
function requete()
{
 
			function getXhr() // fonction type (ne devrait pas être modifiée)
			{
				var xhr = null; 
 
				if(window.XMLHttpRequest) // Firefox et autres
				   xhr = new XMLHttpRequest(); 
				else if(window.ActiveXObject)
				{ // Internet Explorer 
				   try {
							xhr = new ActiveXObject("Msxml2.XMLHTTP");
						} 
					catch (e) 
						{
							xhr = new ActiveXObject("Microsoft.XMLHTTP");
						}
				}
				else 
				{ // XMLHttpRequest non supporté par le navigateur 
				   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
				   xhr = false; 
				} 
 
				return xhr
			}
 
 
			var xhr = getXhr();
			// On défini ce qu'on va faire quand on aura la réponse
			xhr.onreadystatechange = function()
				{
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200)
					{
						var reponse = xhr.responseText; // réponse de la requête
						document.getElementById('depart').value = reponse; //affecte la réponse à l'input id = "depart" (c'est un exemple pour utiliser la réponse)
					}
				}
 
			var depart = document.getElementById('depart').value;//charge la valeur de l'input id = "depart"
 
			var url = 'ajax.php?get_depart='+depart;// passage d'une variable GET vers le fichier ajax.php
 
			xhr.open("GET",url,true); // envoi de la requête méthode GET vers url, type asynchrone = true
			xhr.send(null);
 
}
 
 
function auto()
{
	setInterval("requete()", 5000);
}
-->
</script>
</head>
 
<body onload = "auto()">
 
<input type = "text" name = "depart" id = "depart" value = "0" />
 
<input type = "button" name = "bouton" value = "requete" onclick="requete()" />
 
</body>
</html>

contenu du fichier ajax.php

Code:

1
2
3
4
5
<?php
$var = isset($_GET['get_depart'])? $_GET['get_depart'] :0;
 
echo $var + 10;
?>

Donc dans cet exemple soit tu fais ta requête en appuyant sur le bouton, ce qui va augmenter la valeur de ton input de +10, soit tu laisse faire et toutes les cinq secondes cela va se faire automatiquement à l'aide de la fonction auto.

Pour que cela fonctionne cela suppose que le fichier ajax.php ci dessus soit dans le même répertoire que la page html donnée en exemple.

ça avance pas beaucoup , j'ai ce code pour faire le décompte :

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
<script type="text/javascript">
	var valeur_origine = 30;
 
 
	var valeur = valeur_origine
	var x;
	function Init()	{
		window.document.getElementById('compteur').value=valeur;
		x = window.setInterval('Decompte()', 1000);
	}
 
	function Decompte()	{
		((valeur > 0)&&( ! window.document.getElementById('MaCheck').checked)) ? (window.document.getElementById('compteur').value = --valeur) : (window.clearInterval(x));
 
	}
 
	function Relance(elem)	{
		if( ! elem.checked )		x= window.setInterval('Decompte()', 1000);
	}
 
	function ResetCompteur()	{
		valeur = valeur_origine;
		window.document.getElementById('MaCheck').checked = false;
		window.clearInterval(x)
		Init();
	}
		window.onload = Init;
 
</script>
 
</head>
<div id="boite">
<meta HTTP-EQUIV="Refresh" content="30;URL=lien.php">		 
<input type="text" name="compteur" id="compteur" size="2" readonly="readonly">
<input type="hidden" name="MaCheck" id="MaCheck" onclick="Relance(this);">
</div>

Au bout de 30 seconde ça redirige mais je ne comprends pas grand chose au Ajax ou javascript ...Juste Php et Html

16/03/2011, 21h56
ABCIWEB

Ben justement je t'ai fait un code documenté à partir du tuto pour comprendre le fonctionnement d'une requête ajax et comment exploiter le retour. T'as testé et compris mon code ? Ou est-ce que tu bloque ?

Et aussi si tu veux que l'on puisse t'aider il faudrait que tu nous dise ce veux tu faire exactement.

Qu'est censé faire ton code ?
A quoi va servir cette requête au bout de trente seconde ?
17/03/2011, 04h14
andry.aime

Bonjour,

1- Vire ce code qui rafraichit la page.

Citation:

<meta HTTP-EQUIV="Refresh" content="30;URL=lien.php">

2-

Citation:

window.document.getElementById('MaCheck').checked

Un input hidden n'a pas d'attribut checked.
3-

Citation:

<input type="hidden" name="MaCheck" id="MaCheck" onclick="Relance(this);">

Comment tu arrives à cliquer sur un input hidden :mouarf:.
4-

Citation:

je ne comprends pas grand chose au Ajax ou javascript

Les tutoriels sont fait pour faire comprendre.

5- Apparemment tu ne veux qu'un code tout fait sans rien essayer :roll:.

A+.