Déclenchement régulier d'une fonction

Avant tout je tiens a préciser que je suis un dev php et qu'enfin j'ai craqué pour me mettre à Javascript ce qui est vraiment indispensable aujourd'hui (vous pouvez me solliciter).

C'est le principalement les fonctionalités AJAX qui m'interesse.

Sur un site je voudrais afficher un petit point rouge avec le nombre de message non lu de la personne qui consulte à la manière de l'icone SMS sur Iphone.

J'ai donc ecrit un petit bout de code en php qui donne ce nombre.

En JS j'ai trois fonctions :
La première interroge mon code php
La seconde appelle la première et ecrit le resultat dans une div (je suis juste en test)
La troisième devrait appeler la seconde régulièrement. Mais c'est la que je bloque. Le résultat ne se mets pas a jour (alors que si je le mets dans un <a onclick="start" ca marche).
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 <!DOCTYPE html> <html> <body> <p id="demo"></p> <script type="text/javascript"> function CombienNonLu() { var request = new XMLHttpRequest(); var nbnonlu = false; request.open("GET", "/ajx/ajx_CombienNonLu.php", false); request.send(null); if(request.status == 200) { var nbnonlu = request.responseText; } return nbnonlu; } function ecritnbnonlu() { var nb = CombienNonLu(); if(nb == false) { nb = 0; } document.getElementById('demo').innerHTML = nb; } function start() { intervalId = setInterval(ecritnbnonlu(), 2000); } start(); </script> </body> </html>
Ou est ce que je me plante ?

Bonjour,

Citation:

Envoyé par Cheorches

...J'ai donc ecrit un petit bout de coude...

Il va te falloir de l'huile de code... :aie:

Citation:

Envoyé par jreaux62

Il va te falloir de l'huile de code... :aie:

C'est parce que j'écris avec mes pieds ;)

Code:

1
2
3
4
5
function start()
{
	window.setInterval(ecritnbnonlu, 2000);
}	
window.onload = start;

ou encore :

Code:

1
2
3
4
5
6
7
8
9
function start()
{
	window.setInterval(function(){
		ecritnbnonlu();
	, 2000);
}	
window.onload = function(){
	start();
};

Cela dit :

pas besoin de 3 fonctions
autant utiliser Ajax en asynchrone
+ pense à utiliser "use strict";.

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
<script>
"use strict";
function CombienNonLu()
{
	var request = new XMLHttpRequest();
	var nbnonlu = false;
	nbnonlu = false;
	// Ajax, asynchrone
	request.onreadystatechange = function(){
		if(request.readyState == 4 && request.status == 200){
			nbnonlu = request.responseText;	
			if(nbnonlu == false){ nbnonlu = 0; }
			document.getElementById('demo').textContent = nbnonlu;
		}
	}
	request.open("GET","/ajx/ajx_CombienNonLu.php",true);
	request.send(null);
}	
window.onload = function(){
	window.setInterval(function(){
		CombienNonLu();
	}, 2000);
};
</script>

jreaux62 merci beaucoup.

Le fait de diviser en plusieurs fonctions était volontaire.

Si je comprends bien setInterval est une méthode de l'objet window et non une fonction comme j'imaginais ?

A lire :

window.setInterval
Web 2.0, allez plus loin avec AJAX et XMLHttpRequest

S'il n'y a pas de formatage (balises HTML *), il est préférable d'utiliser .textContent plutôt que .innerHTML.
* Ex. :

Code:

document.getElementById('demo').textContent = nbnonlu;

ou

Code:

document.getElementById('demo').innerHTML = '<b>'+nbnonlu+'</b>';