[JQuery] ordre d'execution des action Résolu/Fermé

Question

Bonjour à tous,

j'utilise JQuery[ajax] pour gérer l'affichage de tableaux d'informations au parcours des champs d'un formulaire. Au focus, j'affiche le tableau, au blur, j'affiche une page vide. 

$("input#Types_clients_id").focus(function(){
	jQuery.ajax({
		url:"/cdl/Fichier/infotypesclients",
		success:function(msg){
			$("div#aide").html(msg);
		}
	});
});
$("input#Types_clients_id").blur(function(){
	jQuery.ajax({
		url:"/cdl/Index/vide",
		success:function(msg){
			$("div#aide").html(msg);
		}
	});
});

Mon soucis est que lorsque que je passe d'un champ à un autre, j'ai (théoriquement) mon tableau du champ courant d'afficher, puis la page vide, puis le tableau du champ suivant. 

Or, il arrive que cet ordre ne soit pas respecté et que j'ai mon tableau du champ courant d'afficher, puis le tableau du champ suivant, puis la page vide (donc pas le tableau souhaité d'afficher).

Est-il possible possible de gérer l'ordre d'execution des action JQuery[ajax]?

matdev · Answer

Je suis toujours sur mon petit problème avec jquery. J'ai une petite astuce mais qui à aussi son défaut donc si quelqu'un voit une solution je suis preneur.

Donc pour rappel:
quand je suis sur un champ de mon formulaire, un tableau de choix s'affiche et quand je clique sur un de ces choix la valeur est insérée dans le champ et le tableau reste visible. Lorsque je quitte le champ, le tableau disparé.

Voici mon code pour l'affichage des tableau et leur retrait

$("input#Types_clients_id").focus(function(){
	jQuery.ajax({
		url:"/cdl/Fichier/infotypesclients",		
                success:function(msg){
			$("div#aide").html(msg);
		}
	});
});
$("input#Types_clients_id").blur(function(){
	$(this).delay(1000,function(){
		$("div#aide").html("");
	});
});
$("input#Formes_juridiques_id").focus(function(){
	jQuery.ajax({
		url:"/cdl/Fichier/infoformesjuridiques",
		success:function(msg){
			$("div#aide").html(msg);
		}
	});
});
$("input#Formes_juridiques_id").blur(function(){
	$(this).delay(1000,function(){
		$("div#aide").html("");
	});
});

Voici mon code pour l'insertion des valeurs du tableau dans mes champs

var champ=null;
function setCaretToEnd (input) {
	setSelectionRange(input, input.value.length, input.value.length);
}
function champsur(obj){
	champ=obj;
}
function choisi(val){
	champ.value=val;
	champ.focus();
	setCaretToEnd(champ);
}

J'ai mis en place une temporisation car lorsque je clique sur un choix d'un tableau, je perd le focus et le tebleau disparaissé avant d'insérer le choix dans le champ.

La tempo me permet maintenant de bien insérer mon choix dans le champ mais lorsque je passe d'un champ à un autre mon nouveau tableau s'affiche puis disparait à cause de la tempo de fermeture du tableau précédannt.

Serait-il possible lorsque je me positionne sur un nouveau champ d'interrompre la temporisation et l'action de fermeture du blur du champ précédant ?

matdev · Answer

La réponse était sous mon nez, il suffisait de définir également une temporisation pour l'ouverture des tableaux légérement supérieur à celle des fermetures.

C'est peut être un peu lourd en code mais au moins je sai qu'elles action s'execute dans quel ordre.

Voici la source pour un champ


$("input#Types_clients_id").focus(function(){
	$(this).delay(125,function(){
		jQuery.ajax({
			url:"/cdl/Fichier/infotypesclients",
			success:function(msg){
				$("div#aide").html(msg);
			}
		});
	});
});
$("input#Types_clients_id").blur(function(){
	$(this).delay(100,function(){
		$("div#aide").html("");
	});
});

[JQuery] ordre d'execution des action

2 réponses

Discussions similaires