onChange ou onChangera pas ?

Bonjour tout le monde,
Bonjour Emmanuel, me revoici après six mois d'absence.

J'ai là un problème mystique et j'ai beau étudier le code, j'en reviens à une liste de causes probables. J'en élimine la plus grande partie et retombe tjs sur la même:

Est-ce que mon onChange se lance ?

Je suis en dojo 1.2.3 et voici le champ en question:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

<select dojoType = "dijit.form.ComboBox" id = "monId" name = "monNom" value = "maValeur" autocomplete = "false" searchAttr = "label" ignoreCase = "true" store = "monStore" hasDownArrow = "false" sizeMin = "10" onChange = "maFonction" allowCache = "false" />

---

C'est là un autocomplete qui fonctionne très bien. D'ailleurs, le onChange se lance aussi.
Seulement, je ne trouve pas l'origine de l'erreur et, je me demandais, est-ce que dans un cas bien précis et particulier (tellement particulier qu'on ne parvient pas à le reproduire volontairement), le onChange déciderait de ne pas se lancer (à part celui où l'on entre la même valeur que précédemment) ?

Salut Vermine,

Difficile de répondre à ta question :oops: . Je n'ai jamais rencontré de cas où le onChange décidede ne pas se lancer. Mais on n'est pas à l'abri. :lol:

Que constates tu exactement ? Quel comportement attends tu que tu ne retrouves pas ? Je suis conscient que c'est difficilement reproductible mais cela se passe-t-il au moment du clic dans la liste des options affichées, ou après avoir saisi et validé un choix ?
Les cas de figure ne sont pas trop nombreux et on devrait pouvoir trouver.

A+

ERE

Bonjour Emmanuel,

A dire vrai, je ne suis pas certain que mon problème vient du Dojo car je n'en vois pas du tout la cause et le seul passage que je ne maitrise pas encore, c'est le dojo. Pq est-ce que je pense à lui plutôt qu'au JS, au Java, au SQL ou au HTML ou tout simplement ma logique qui sont également présents dans mon code ? Bah, je pense à eux aussi, mais j'ai beau relire tout et ça me semble correct.
Si je viens icitte, c'est plutôt pour obtenir une certitude théorique.
En fait, avec le dojo 1.2.3 (je n'ai pas testé avec le 1.3) nous avons rencontré un aléa. Je m'explique.

Un autocomplete, tel que celui défini ci-haut, qui gardait en mémoire sa valeur:

1) J'utilise l'autocomplete avec "xxx". Il lance son onchange.
2) Je vide le champ par un script. Il ne lance pas son onchange (normal).
3) Je refais l'autocomplete sur "xxx". Il ne lance pas son onchange. (pas normal). Si je fais l'autocomplete sur "yyy", il lance le onchange.

En gros, il n'a pas remarqué qu'on lui avait vidé sa valeur via le script. Pour contourner le problème, on fait onfocus du champ, on vide le champ, on fait onblur du champ et là on peut retaper "xxx" et il comprend que sa valeur a changée.

C'est là un comportement dont je me serai bien passé et je me demandais donc si ce dojo n'avait pas d'autres surprises du genre sur le déclenchement de son onChange. Je n'affirme donc pas que le onChange ne se lance pas (cas impossible à reproduire et quand il se reproduit, c'est un utilisateur x qui ne sait pas qu'il doit noter les étapes qu'il a faites (si il s'en souvient) pour obtenir le bug afin que nous puissons détecter l'origine). Pareil pour les logs. On ne sait pas quand ça arrive et on ne sait pas ce qu'on doit chercher.
Je ne saurai donc pas répondre à vos questions. Qui quand où comment et quoi ? Ca reste un mystère. Le seul truc que je sais c'est que mon onchange modifie une variable et que parfois, cette variable ne se modifie pas ou bien est vidée par qqun d'autre. Mais... le seul à vider cette variable (j'appelle ça variable mais c'est un champ hidden HTML) c'est une fonction lancée à divers endroits, dont au fameux onChange et qui fonctionne neuf-cent-nonante-neuf fois sur mil. Si pas mil fois sur mil. Vu qu'on ne sait pas si elle se lance la millième fois.

Alors voila, je cherche par élimination. Et quand j'aurai tout éliminé, je prendrai mon baluchon et je quitterai le pays en courant. :lol:

Salut Vermine,

Citation:

---

2) Je vide le champ par un script. Il ne lance pas son onchange (normal).

---

Quel code utilises tu pour vider le champ ?

ERE

Voici les manipulations, ce sont celles que nous avons du faire pour remédier à l'histoire que j'ai raconté dernièrement:

Code:

---

1 2 3 4 5 6

var oObjet = dojo.byId("monChamp");   oObjet.focus(); oObjet.value= ""; oObjet.blur();

---

Mais je dois hélas préciser qqch, ce code est bel et bien exécuté avant que le bug n'arrive mais, le champ ne contenait encore aucune valeur. En l'occurence, on vide un champ déjà vide (c'est pour éviter d'avoir du dédoublement de code car cette fonction est utilisée à diverses reprises).

Pour rappel, cet aspect dojo est peut-être totalement correct et performant et l'erreur vient peut-être d'autre part. On reste bien dans la théorie.

Code:

---

1 2	dijit.byId("monChamp").attr(value,"");

---

ERE

Merci Emmanuel,

mais, pourrais-tu m'expliquer ? Car mon code fait ce que je lui demande. Quelles sont les différences avec le tiens ? Cela explique-t-il qu'une fois de temps en temps, le onChange ne se lance pas ?

De plus, je ne sais pas tester ton code pour l'instant, et... même si je l'implémentais, vu qu'on ne sait pas comment reproduire le bug, je ne peux pas dire à mon patron "j'ai peut-être une solution" alors que je ne sais pas la vérifier.

Citation:

---

Envoyé par vermine

Merci Emmanuel,

mais, pourrais-tu m'expliquer ? Car mon code fait ce que je lui demande. Quelles sont les différences avec le tiens ? Cela explique-t-il qu'une fois de temps en temps, le onChange ne se lance pas ?

---

Je vais essayer d'être clair: tu écris comme code

Code:

---

1 2 3 4

var oObjet = dojo.byId("monChamp"); oObjet.focus(); oObjet.value= ""; oObjet.blur();

---

Première erreur: le contrôle créé par Dojo n'est pas récupéré par dojo.byId mais par dijit.byId. dojo.byId renvoie quant à lui le "principal" noeud du controle.
De là ton code HTML

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<select dojoType = "dijit.form.ComboBox" id = "monId" name = "monNom" value = "maValeur" autocomplete = "false" searchAttr = "label" ignoreCase = "true" store = "monStore" hasDownArrow = "false" sizeMin = "10" onChange = "maFonction" allowCache = "false" />

---

est ainsi parsé et transformé par Dojo en :

Code:

---

1 2 3

<div class="dijitReset dijitInputField"> <input id = "monId" class="dijitReset" type="text" waistate="haspopup-true,autocomplete-list" wairole="textbox" dojoattachpoint="textbox,focusNode" ..../> </div>

---

Cela explique déjà le fait que quand tu appelles

Code:

---

1 2	var oObjet = dojo.byId("monId"); oObjet.value= "";

---

tu vois bien l'affectation car tu modifies le INPUT. tu vois mais pour autant tu as court-circuité les mécanismes du contrôle Dijit ComboBox :aie:. Car voilà le code source du contrôle, qui est exécuté quand tu effectues dijit.byId("monId").attr(value,""); (donc quand tu ne court-circuites pas le contrôle):

Code:

---

1 2 3 4

_setValueAttr: function(/*Object*/ value){ this.value = value; this.onChange(value); },

---

Je suis certain que cela se passe de commentaires ;) et que tu as déjà tout pigé.

Amicalement,

ERE

Hola, je ressens quelques véhémences inutiles. :cry:
Merci pour tes explications claires et concises, ceci explique pq nous avons du faire focus, value, blur. Mais, ceci n'explique pas pq une fois de temps en temps, mon champ reste/devient vide, à moins que ce ne soit un coup de chance que ça fonctionne neuf-cent-nonante-neuf fois sur mil, chose qui est tout à fait envisageable, je le garde à l'esprit. Mais, soyons rigoureux.
Je vais donc soumettre la modificiation dojo.byId ---> dijit.byId et reviendrai dire icitte ce qu'il en est.



EDIT: Est-ce que cette instruction va déclencher l'évènement onChange ? (oui, je n'ai qu'à tester mais je n'ai pas d'environnement tout fait en dojo 1.2.3 sous la main et j'ai plusieurs étalons à chevaucher avant la fin de la semaine, j'essaie d'économiser le temps)

Code:

---

this.onChange(value);

---

J'ai lu dans un autre de tes posts cette petite différence, est-ce important ?

Code:

---

dijit.byId("division").attr("value","");

---

Salut Vermine,

Citation:

---

Hola, je ressens quelques véhémences inutiles.

---

Loin de moi cet état d"esprit :lol: et désolé si cela a été ainsi perçu :cry:

Oups:

Code:

---

dijit.byId("monChamp").attr("value","");

---

Le this.onChange(value); appelle ta fonction onChange (en fait this.onChange(value); est ta fonction onChange)

Et je pense qu'une fois tes modifs en place tu n'auras plus aucun souci, ceux que tu as doivent provenir de l'aller-retour sur le focus.

ERE

Citation:

---

Envoyé par emmanuel.remy

Loin de moi cet état d"esprit :lol: et désolé si cela a été ainsi perçu :cry:

---

Autant pour moi. :oops: C'est vrai que je ne t'ai jamais connu ainsi, mais je me disais qu'un jour ingrat peut arriver à tout le monde, et que certains modérateurs/administrateurs de ce forum n'hésitent pas à faire ressentir la grandeur de ta bêtise et la réalité de ton incapacité ("tu" impersonnel). Mais ça, c'est une autre histoire... ;)

Citation:

---

Envoyé par emmanuel.remy

Le this.onChange(value); appelle ta fonction onChange (en fait this.onChange(value); est ta fonction onChange)

---

J'ai bien peur de ne pas comprendre. Si j'ai ceci:

Code:

---

onChange = "alert('Coucou gamin!')";

---

Le fait de faire via un script:

Code:

---

dijit.byId("monChamp").attr("value","");

---

Va lancer mon alert ? 8O

Citation:

---

Envoyé par vermine

Autant pour moi. :oops: C'est vrai que je ne t'ai jamais connu ainsi, mais je me disais qu'un jour ingrat peut arriver à tout le monde, et que certains modérateurs/administrateurs de ce forum n'hésitent pas à faire ressentir la grandeur de ta bêtise et la réalité de ton incapacité ("tu" impersonnel). Mais ça, c'est une autre histoire... ;)




J'ai bien peur de ne pas comprendre. Si j'ai ceci:

Code:

---

onChange = "alert('Coucou gamin!')";

---

Le fait de faire via un script:

Code:

---

dijit.byId("monChamp").attr("value","");

---

Va lancer mon alert ? 8O

---

Je pense, oui.

ERE

C'est là qqch de rudement démoniaque. 8O
Imaginons une variable globale "i", notre champ avec un onChange et la fonction du onChange qui ferait ceci:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14

var i = 1;   function maFonction() { var uneValeur = dojo.byId("uneValeurQuiChangeRarement").value;   if(uneValeur == "ca sent la boucle infinie, ça") { dijit.byId("monChamp").value = i; alert("Je sais compter jusqu'à " + i); i++; } }

---

Je vois l'malaise, et il sera venu sans qu'on y ait pensé. D'autant plus que l'alert est là pour faire joli dans mon exemple, mais que dans la réalité, ça pourrait être un code discret qui tournerait inlassablement sans qu'on ne s'en aperçoive et qui ferait planter le bazarre quelques étapes plus loin.

Je le testerai prochainement, et aviserai ensuite de sa possible adoption dans mon programme car, non, je n'aurai pas de boucle infinie, je pense, mais je risque de dédoubler des appels ajax inutilement et je n'apprécie guère cette optique.

Je te tiendrai au courant dès que possible (peut-être demain, peut-être la semaine prochaine).

Citation:

---

Envoyé par vermine

C'est là qqch de rudement démoniaque. 8O
Imaginons une variable globale "i", notre champ avec un onChange et la fonction du onChange qui ferait ceci:

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14

var i = 1;   function maFonction() { var uneValeur = dojo.byId("uneValeurQuiChangeRarement").value;   if(uneValeur == "ca sent la boucle infinie, ça") { dijit.byId("monChamp").value = i; alert("Je sais compter jusqu'à " + i); i++; } }

---

Je vois l'malaise, et il sera venu sans qu'on y ait pensé. D'autant plus que l'alert est là pour faire joli dans mon exemple, mais que dans la réalité, ça pourrait être un code discret qui tournerait inlassablement sans qu'on ne s'en aperçoive et qui ferait planter le bazarre quelques étapes plus loin.

Je le testerai prochainement, et aviserai ensuite de sa possible adoption dans mon programme car, non, je n'aurai pas de boucle infinie, je pense, mais je risque de dédoubler des appels ajax inutilement et je n'apprécie guère cette optique.

Je te tiendrai au courant dès que possible (peut-être demain, peut-être la semaine prochaine).

---

Effectivement mais c'est un cas improbable étant donné que dans le cas d'une combo il n'y a pas de réelle raison de modifier dans le onChange la valeur du contrôle.

ERE

Millepertuis !


Bonjour Emmanuel,

Tout d'abord, avant que je n'oublie, pour obtenir la boucle infinie, je suis d'accord, il faut le vouloir. Cependant, dans le cas qui me préocupe (je ne sais plus comment cela s'écrit :oops:) je joue avec des appels Ajax et si j'implémente le dijit.byId, je risque de sextupler mes appels. 8O Et bien évidemment, les cinq appels supplémentaires sont totalement superflus et ne ferait que vérifier un travail assuré par leur prédécesseur. D'autant plus qu'ils seraient lancés en parallèle et chipoteraient de mêmes valeurs. :roll:
J'avoue que je me tâte...

Toutefois, et c'est de là que nait mon émerveillement, j'ai trouvé un illogisme dans mon code! \o/
Oui, Monsieur, et je vous demande votre avis. Voici le code machiavélique:

Code:

---

1 2 3 4 5 6

var monObjet = dojo.byId("monChamp");   monObjet.focus(); dojo.byId("monChamp").value = "maValeur"; monObjet.blur();

---

M'est avis que le focus et le blur se font sur un autre objet que monChamp...
Malheureusement, même si ce code est la source de mes ennuis, je ne comprends tjs pas pq dans la grosse majorité des cas, il a fonctionné sans autre forme de procès... :( Mais ça m'arrangerait que ce soit la réponse à mon problème car j'éviterai ainsi de devoir nourir six bébés au lieu d'un. ;)



EDIT: Mais non, mais non! J'enrage. :cry:
Je doute. C'est horrible, je doute que ce code soit le fautif même si il est erroné.

Salut Vermine,

Non, je pense que ton code se fait sur le bon champ car Dojo redonne l'id d'origine que tu fournis, à la balise INPUT qu'il crée.


Et je persiste: enlève ces 3 lignes et passe par un .attr("value",...). ;)

Et concernant tes cinq appels AJAX supplémentaires, je ne comprends pas comment le fait de déclencher un onChange peut le regénérer 5 fois. :cry: Si c'est le cas (et c'est possible en événementiel, mais il existe des parades) je te fournirai une solution pour annuler ce comportement. Peux tu préciser ce point ?

ERE

Je le peux. 8-)

Alors voici le contexte. J'ai quatre champs qui sont liés. Prenons un exemple compréhensible et simple: le multilinguisme.

Champ 1: français
Champ 2: anglais
Champ 3: flamand
Champ 4: allemand

Chaque champ a le même onChange et ils sont forcément tous en édition. Vides au départ, si je tape "un" dans le champ 1, il fait un appel ajax qui me ramène les traductions et je viens les écrire dans les trois autres champs.

Ca me fait un appel ajax et j'ai les quatre valeurs que je désirais, jusque là, tout va bien.

Seulement, le champ 2 a changé de valeur, donc le dijit.byId("champ2").attr("value","one") va lancer le onChange si j'ai bien compris.

Ca me fait deux appels ajax dont un inutil vu que j'ai déjà mes quatre réponses.

Pendant que cet ajax se réalise, le champ 3 s'aperçoit qu'il a changé de valeur lui aussi (il est passé de vide à "een"). Donc, en tant que bon élève, il lance son onChange.

Ca me fait trois appels ajax dont deux inutils.

Pendant ce temps là, l'appel ajax du champ2 se termine, il va remodifier les valeurs déjà présente. Heureusement, il met les mêmes donc les onChange ne vont plus se lancer.
Cependant, le champ4, un peu à la traine, fait comme ses voisins et lance son onChange.

J'en suis à quatre appels ajax dont trois inutils.

L'ajax numéro 3 se termine, vient modifier les valeurs déjà présente.
L'ajax numéro 4 se termine, vient modifier les valeurs déjà présente (quel recopieur, celui-là!).
Rien d'autre ne se déclenche car depuis le début, on joue avec les quatre mêmes valeurs.

Et moi, pendant c'temps-là, j'tournais la manivelle. ♫

Je n'aime pas trop ça.

OK. Dans ce cas, à ta place je créerais une variable globale (flag) booléenne qui informe qu'on est en cours de résultat de traduction. Au retour de la fonction AJAX, et avant d'appeler les modifications des valeurs des autres combos, je mettrais la variable à true, puis dans le onchange je testerais cette variable et quitterais si elle est à true.

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

var enCoursDeResultat=false; ...   // le retour de la fonction AJAX qui met à jour les autres combos enCoursDeResultat=true; dijit.byId("cboEnglish").attr("value",...); dijit.byId("cboSpanish").attr("value",...); dijit.byId("cboItalian").attr("value",...); enCoursDeResultat=false;   //la fonction liée à onChange function doOnChange() { if enCoursDeResultat return;   ... suite du code avec appel AJAX }

---

Qu'en penses tu ?

ERE

C'est ma foi fort agréable à entendre.
Du bricolage, restons honnête, mais inévitable, apparement.
Je vote pour. :ccool:
J'étudie le code tantôt pour voir si c'est envisageable et je teste ça lundi si j'ai le temps.
Merci, Emmanuel.

Citation:

---

Du bricolage, restons honnête, mais inévitable, apparemment.

---

On ne peut malheureusement pas faire autrement et c'est souvent le cas dans les applications événementielles. Car n'oublions pas quand même - il faut rester honnête jusqu'au bout ;) - que la logique initiale est celle-ci: "quand la valeur de la combo change, alors mets à jour les autres", et c'est bien ce qui se passe. Nous ne faisons qu'adapter: "quand la valeur de la combo change et que cela ne provient pas d'une autre combo, alors mets à jour les autres" !

ERE