Interception d'une modification d'input par le JS

Version imprimable

12/07/2011, 18h08
drumtof

Interception d'une modification d'input par le JS

Bonjour à tous,

Je me heurte au problème suivant :
J'ai deux input dont l'un (visible) est alimenté par l'autre (de type hidden). Le champ caché pouvant être mis à jour par une fonction js.
Il faut alors (chose que je n'arrive pas à faire) que je répercute cette modification dans mon champ visible.

Y a t-il un moyen d'intercepter d'une modification d'input faite par une fonction JS (ex : document.monInput.value="toto") ?

Si oui quelqu'un pourrais-il me mettre sur la piste, car je n'ai pour le moment absolument rien trouvé qui marche. :cry:

Merci d'avance à tous.
TOF
12/07/2011, 18h28
javatwister

euh, c'est une blague ou quoi?

si tu fais:

Code:

document.monInput.value="toto"

pourquoi tu ne fais pas dans la foulée:

Code:

document.monInput_visible.value="toto"

?
13/07/2011, 08h29
andry.aime

Bonjour,

Attention,

Code:

document.nomForm.nomInput.value="tata";

A+.
13/07/2011, 08h59
javatwister

Oui andry, ce n'est pas faux :mrgreen:
13/07/2011, 09h02
SpaceFrog

Code:

document.forms['nomForm'].elements['nomInput'].value="tata";

mais on va pas chipoter :mrgreen:
18/07/2011, 15h31
drumtof

Merci à tous pour vos réponses mais c'est un peu plus compliqué sinon je n'aurais pas poser la question :)

En fait je ne peux pas toucher la fonction JS m'étant à jour ces champs. Il faudrait que sur le changement de mon input hidden se déclenche un appel js pour mettre à jour mon champ visible.

Ce qui me pose problème c'est que je n'arrive pas a déclencher cette événement sur mon input hidden car j'ai l'impression que son changement de valeur (effectué par le JS que je ne peut pas toucher) n'engendre aucun événement. Est-ce vrai ? si oui comment contourner le problème ?

Bonsoir,
il est vrai qu'il est bien dommage que l'événement onchange ne se déclenche pas lors d'une modification de la value via le javascript.

Il existe deux méthodes pour arriver à tes fins, la bourrin et la filoute

- la méthode dite du bourrin, tu fais une vérification périodique via un setInterval.

- la méthode dite du filou, tu détournes la fonction et tu la remplaces par la tienne qui fait d'abord appel à celle ci, ce qui te permet de rajouter du code perso.

exemple :
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 <!DOCTYPE html> <html> <head> <title>[Version Filoutte...]</title> </head> <body> <input id="cache" type="text" value="undefined" disabled> <select onchange="changeValeur( this);"> <option value="un">un</option> <option value="deux">deux</option> <option value="trois">trois</option> <option value="quatre">quatre</option> <option value="cinq">cinq</option> </select> <br><input id="modif" type="text" value=""> <script type="text/javascript"> // variable var oSrce = document.getElementById('cache'); var oDest = document.getElementById('modif') // la fonction que je ne peux pas modifier function changeValeur( obj){ oSrce.value = obj.value; } // sauvegarde la fonction var oldChange = changeValeur; // redefini la fonction changeValeur = function(){ // appel de l'ancienne oldChange.apply( null, arguments); // ajout mon code oDest.value = oSrce.value; }; </script> </body> </html>
la fonction non modifiable est simuler par le onchange sur le SELECT, et le INPUT hidden est ici en readonly

19/07/2011, 16h04
drumtof

Merci pour cette réponse mais la mise en place en cette solution pour moi ne fonctionne pas car la fonction que je ne peut pas touchée fait une redirection :(

je crois que je suis coincé :cry:
19/07/2011, 19h34
NoSmoking

Citation:

Envoyé par drumtof

Merci pour cette réponse mais la mise en place en cette solution pour moi ne fonctionne pas car la fonction que je ne peut pas touchée fait une redirection :(

j'ai du mal à comprendre l'intérêt de modifier la valeur d'un champ si une fois la mise à jour du champ hidden une redirection est réalisée.

- Si c'est toi qui traite la redirection, je penses que oui à priori, je ne vois pas l'intérêt de 2 champs pour une même valeur.
- Demande à l'auteur du script de modifier sa fonction...

Mais je pense que quelque chose m'échappe :koi:
20/07/2011, 00h01
Watilin

Cette histoire de redirection me laisse perplexe moi aussi. Sinon, j’ai pensé à la mystérieuse méthode watch mais c’est un truc spécifique à Mozilla.

En tout cas, comme la propriété value est modifiée programmatiquement, la technique watch fonctionne, je viens de tester.

Drumtof, si ça t’intéresse, tu peux essayer de mettre en œuvre la solution cross-browser proposée sur Stackoverflow, en gardant à l’esprit que, de toute façon, ça ne marchera pas sur les versions d’IE inférieures à 8.

;)
20/07/2011, 08h14
Bovino

Pour IE, tu as toujours l'événement onafterupdate ;)
Ceci dit drumtof, pour que l'on puisse t'aider efficacement, il serait bon d'être plus précis quant au problème rencontré et l'environnement dans lequel tu te trouve...
20/07/2011, 10h10
drumtof

Merci à tous pour vos réponses et dsl de mon imprécision. J'intègre un progiciel de GED avec des évolutions spécifiques du client et j'essaie de toucher un minimum le progiciel pour la portabilité dans les versions supérieures.

Mais ici dans mon cas précis je n'aurais pas le choix de toucher le progiciel.

Merci pour votre aide et votre soutiens tjrs aussi efficace. :)