Synchronisation, une instruction javascript après une autre. [Résolu]

[koyuki90]

Bonjour,

Je dois gérer une IHM Web qui après avoir cliqué sur un bouton avec un id spécifique affiche une fenêtre de sélection de cible (par le biais de CheckBox) avec Ajax.

Seulement je dois aussi prévoir une fonctionnalité qui permet de copier une sélection qui a été déjà passé. J'ai donc crée un bouton qui appelle exactement la même fonction qu'avant mais qui à la fin coche les checkbox qui sont apparu dans la fenêtre de sélection des cibles.

Voici le code : (tout tiens en une fonction, le fait de créer une sélection vierge ou à partir de l'existant se fait en fonction du deuxième argument de la fonction):

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
function apparaitreCreationCommande(idItem,idCommande) {
 
// On fait apparaître la fenêtre de création de commande, en chargeant les cibles correspondant au déploiement
var idDeploiement = $("#"+idItem).attr("name");
$("#div_creation").attr('src','');
var action = $("#form_listeCible").attr("action");
var dataString = "idDeploiement=" + idDeploiement;
$('#div_creation').html('<p><img src="img/ajax-loader.gif" width="220" height="19" /></p>');	
 
 // Requête Ajax pour obtenir les choix possibles dans la sélection			
$.ajax( {
	type : "POST",
	url : action,
	data : dataString,
	dataType : "html",
	success : function(data) {
	        $('#div_creation').html(data);
	},
	error : function() {}
});
 
$('#li_deploiement_'+idDeploiement).css("background","#DEFAFF");
document.getElementById('wrap').style.height="500px";
$(".boutonOuvrirCreation").attr('disabled', 'disabled');
$('#div_creation').slideToggle(); // La fenêtre de sélection a été chargé avec la requête Ajax, je l'affiche alors avec une fonction JQuery
 
	// Si une idCommande a été renseignée (idCommande != 0, avec le bouton "Copier Commande") on coche les
	// cases correspondant à la commande copiée
 
	if (idCommande != 0)
	{
		fonctionCocher(); // Contient des instructions du type : $("#toto[type='checkbox']").attr("checked","true");	
	}
	return false;
}

Le soucis arrive au moment où je veux cocher les cases (la fonction fonctionCocher), où rien ne se passe. En lançant les instructions qu'il y a dans fonctionCocher() par firebug les cases se cochent bien.

Je pense qu'il y a un soucis de synchro entre les instructions Javascript, car il me semble qu'après avoir lancé un traitement on appelle la suivante sans vraiment avoir la fin de la première...

Quelqu'un aurait-il une idée pour palier à ce problème? J'aimerai bien ne pas à avoir utiliser des fonctions d'attente comme delay, bien que je ne sois pas sûr que ça marcherait.

Merci d'avance !

[Bovino]

car il me semble qu'après avoir lancé un traitement on appelle la suivante sans vraiment avoir la fin de la première...

C'est presque ça, en fait, au moment d'interpréter le code, JavaScript fait un shuffle des instructions histoire de rigoler...
Ou alors, il s'agit juste du fait que tu continues les traitements après l'appel AJAX avant d'avoir reçu la réponse du serveur
As-tu bien appréhendé la notion de requête asynchrone ?

[koyuki90]

Merci pour le déplacement du sujet et pour la réponse rapide !

Je comprends le principe des requêtes asynchrone, que le serveur n'attend pas la fin d'une requête pour continuer. Cependant je ne la maîtrise pas vraiment, et n'ai pas le temps de m'initier à fond sur js et ajax du coup je plante un peu sur ces points là...

Je sais cependant qu'on pourrait utiliser des méthodes sur un objet XMLHttpRequest que j'aurai instantié, pour être informé de son aboutissement.
J'ai lu des choses dessus mais pas assez pour l'utiliser facilement, mais suis-je sur la bonne voie?

[Bovino]

Cependant je ne la maîtrise pas vraiment, et n'ai pas le temps de m'initier à fond sur js et ajax du coup je plante un peu sur ces points là...

Ben ouais... c'est souvent ça le problème : vouloir utiliser des outils sans apprendre au préalable comment ça fonctionne.
Je dis pas ça spécialement pour toi, mais c'est une attitude que l'on rencontre régulièrement...

Bref, pour faire simple, toutes les instructions liées à ce que te renvoie le serveur doivent se trouver dans la fonction associée à success.

[koyuki90]

Merci bien ça marche !

Je sais que cette mentalité n'est pas spécialement propre mais on nous demande de plus en plus de devoir toucher à une technologie sans avoir le temps de se l'approprier..

En tout cas merci de tes réponses !