Discussion :

[Nulenprogra]

Bonsoir,

voilà, quand je fais un appel ajax, je voudrais le faire en synchrone et afficher un message d'attente pendant le traitement.

j'ai une DIV avec le message "sauvegarde en cours" qui existe sur la page.

lors du démarrage de la sauvegarde (clic sur un bouton qui appel la fonction ajax), je rend la DIV visible, et à la fin du traitement, je la rend hidden.

Mais, en fait, dans la réalité, quand je clic sur mon bouton, il s'enfonce, rien n'apparait à l'écran, et puis il me rend la main.

dois-je faire un "refresh" ou quelque chose pour que la div s'affiche ?


merci

[arkandias]

En rendant le DIV visible avant d'effectuer la fonction Ajax, et en le rendant invisible après la fin, ca ne marche pas ?

[Zoons]

J'ai le même problème.

En début de fonction j,affecte mes DIV avec le style visible et après j'effectue ma fonction httpRequest.

Mais mon DIV d'attente ne s'affiche pas.

[SpaceFrog]

Ne le fait pas lors du démarrage, mais juste avant ...

[Nulenprogra]

Ben je le fais avant les appels ajax, mais j'ai l'impression qu'il n'a pas le temps de l'afficher.

il faut peut-être un genre de sleep ou un refresh avant ?

voici ma fonction:

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
function save_plan(param){
 
	document.getElementById('div_sauvegarde').style.visibility='visible';
 
	var xhr = getXMLHTTP();
	xhr.onreadystatechange = function(){
		alert(xhr.readyState);
		if(xhr.readyState == 4 && xhr.status == 200){
			alert(xhr.responseText);
		}
	}
	xhr.open("POST","save_local_fire.php",false);
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	xhr.send(param);
	document.getElementById('div_sauvegarde').style.visibility='hidden';
}

[arkandias]

Essaie en mettant un setTimeout ?

[Nulenprogra]

j'ai essayé plusieurs options, sans trouver le bon résultat.

j'ai essayé ceci (en séparant les deux fonctions):

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
function save_et_message(param){
	document.getElementById('div_sauvegarde').style.visibility='visible';
	save_plan(param);
	document.getElementById('div_sauvegarde').style.visibility='hidden';
}
 
function save_plan(param){
 
	var xhr = getXMLHTTP();
	// 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
		alert(xhr.readyState);
		if(xhr.readyState == 4 && xhr.status == 200){
			alert(xhr.responseText);
		}
	}
	// le dernier param est FALSE pour un dialogue synchrone = attend la réponse du serveur
	xhr.open("POST","save_local_fire.php",false);
	// ne pas oublier ça pour le post
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	xhr.send(param);
}

et puis une variante avec un setTimeout:

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
function save_et_message(param){
	document.getElementById('div_sauvegarde').style.visibility='visible';
	setTimeout("save_plan(\""+param+"\")",1);
	document.getElementById('div_sauvegarde').style.visibility='hidden';
}
 
function save_plan(param){
 
	var xhr = getXMLHTTP();
	// 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
		alert(xhr.readyState);
		if(xhr.readyState == 4 && xhr.status == 200){
			alert(xhr.responseText);
		}
	}
	// le dernier param est FALSE pour un dialogue synchrone = attend la réponse du serveur
	xhr.open("POST","save_local_fire.php",false);
	// ne pas oublier ça pour le post
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	xhr.send(param);
}

d'autres idées ?

[arkandias]

Bon admettons...

Code :

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

document.getElementById('div_sauvegarde').style.visibility='hidden';

Ca tu le déplace quand tu as le résultat de ta requete Ajax

Et ensuite essaie avec des temps de setTimeout plus long genre 200ms... ca te donne quoi exactement ?

[Nulenprogra]

Bonsoir,

voilà, après des recherches sur le net, j'ai la solution:

il faut mettre le visible et l'appel de la fonction dans une fonction, et à la fin de l'autre fonction le hidden.

il faut que le browser sorte de la fonction avant d'appeler la sauvegarde ajax

voilà

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
function save_et_message(param){
	document.getElementById('div_sauvegarde').style.visibility='visible';
	window.setTimeout("save_plan(\""+param+"\")",1);
}
 
function save_plan(param){
 
	var xhr = getXMLHTTP();
	xhr.onreadystatechange = function(){
 
		alert(xhr.readyState);
		if(xhr.readyState == 4 && xhr.status == 200){
			alert(xhr.responseText);
		}
	}
	xhr.open("POST","save_local_fire.php",false);
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	xhr.send(param);
 
	document.getElementById('div_sauvegarde').style.visibility='hidden';
}

[Nulenprogra]

Arkandias, tu as entièrement raison !

j'ai trouvé la soluce pendant que tu la publiais ;-)

Merci !

[arkandias]

Oui

Eh ben de rien, bonne soirée !