Interception d'une modification d'input par le JS [Résolu]

drumtof · 12/07/2011, 18h08

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.

Merci d'avance à tous.
TOF

javatwister · 12/07/2011, 18h28

euh, c'est une blague ou quoi?

si tu fais:

Code :

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

document.monInput.value="toto"

pourquoi tu ne fais pas dans la foulée:

Code :

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

document.monInput_visible.value="toto"

?

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

Bonjour,

Attention,

Code :

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

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

A+.

javatwister · 13/07/2011, 08h59

Oui andry, ce n'est pas faux

SpaceFrog · 13/07/2011, 09h02

Code :

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

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

mais on va pas chipoter

drumtof · 18/07/2011, 15h31

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 ?

NoSmoking · 18/07/2011, 22h30

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 :

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
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

drumtof · 19/07/2011, 16h04

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é

NoSmoking · 19/07/2011, 19h34

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

Watilin · 20/07/2011, 00h01

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.

Bovino · 20/07/2011, 08h14

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...

drumtof · 20/07/2011, 10h10

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.

12/07/2011, 18h08	#1
drumtof Nouveau Membre du Club Inscription : mai 2009 Messages : 135 Détails du profil Informations forums : Inscription : mai 2009 Messages : 135 Points : 32 Points : 32	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. Merci d'avance à tous. TOF
	00

12/07/2011, 18h28	#2
javatwister Expert Confirmé danseur Inscription : août 2003 Messages : 2 667 Détails du profil Informations personnelles : Sexe : Localisation : France, Calvados (Basse Normandie) Informations professionnelles : Activité : danseur Informations forums : Inscription : août 2003 Messages : 2 667 Points : 3 035 Points : 3 035	euh, c'est une blague ou quoi? si tu fais: Code : Sélectionner tout - Visualiser dans une fenêtre à part document.monInput.value="toto" pourquoi tu ne fais pas dans la foulée: Code : Sélectionner tout - Visualiser dans une fenêtre à part document.monInput_visible.value="toto" ? __________________ On ne mord pas, on manifeste seulement notre tristesse face à des exposés de situations qui défient notre entendement binaire.
	00

13/07/2011, 08h29	#3
andry.aime Rédacteur/Modérateur Andry Aimé Inscription : septembre 2007 Messages : 5 128 Détails du profil Informations personnelles : Nom : Andry Aimé Localisation : Ile Maurice Informations forums : Inscription : septembre 2007 Messages : 5 128 Points : 7 269 Points : 7 269	Bonjour, Attention, Code : Sélectionner tout - Visualiser dans une fenêtre à part document.nomForm.nomInput.value="tata"; A+.
	00

13/07/2011, 09h02	#5
SpaceFrog Rédacteur/Modérateur Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Inscription : mars 2002 Messages : 30 019 Détails du profil Informations personnelles : Sexe : Localisation : Royaume-Uni Informations professionnelles : Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Secteur : Industrie Informations forums : Inscription : mars 2002 Messages : 30 019 Points : 45 114 Points : 45 114	Code : Sélectionner tout - Visualiser dans une fenêtre à part document.forms['nomForm'].elements['nomInput'].value="tata"; mais on va pas chipoter __________________ Ma page Developpez Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts) Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir... Votre post est résolu ? Alors n'oubliez pas le Tag réalisations :www.planet-languages.com\|www.saftair.com\| www.ouestisol.fr \| www.sebemex.fr \| www.extramiante.fr \| www.sistac-alizay.fr \| www.acoustishop.fr \| www.litt.fr \| www.ouestventil.fr
	00

20/07/2011, 00h01	#10
Watilin Membre Expert Matilin Torre Étudiant Inscription : juin 2010 Messages : 679 Détails du profil Informations personnelles : Nom : Matilin Torre Âge : 23 Localisation : France, Ille et Vilaine (Bretagne) Informations professionnelles : Activité : Étudiant Informations forums : Inscription : juin 2010 Messages : 679 Points : 1 202 Points : 1 202	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. __________________ Disposition de clavier ergonomique française : Bépo
	00

13/07/2011, 08h59	#4
javatwister Expert Confirmé danseur Inscription : août 2003 Messages : 2 667 Détails du profil Informations personnelles : Sexe : Localisation : France, Calvados (Basse Normandie) Informations professionnelles : Activité : danseur Informations forums : Inscription : août 2003 Messages : 2 667 Points : 3 035 Points : 3 035	Oui andry, ce n'est pas faux
	00

18/07/2011, 15h31	#6
drumtof Nouveau Membre du Club Inscription : mai 2009 Messages : 135 Détails du profil Informations forums : Inscription : mai 2009 Messages : 135 Points : 32 Points : 32	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 ?
	00

19/07/2011, 16h04	#8
drumtof Nouveau Membre du Club Inscription : mai 2009 Messages : 135 Détails du profil Informations forums : Inscription : mai 2009 Messages : 135 Points : 32 Points : 32	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é
	00

20/07/2011, 08h14	#11
Bovino Responsable Développement Web Didier Mouronval Développeur Web Inscription : juin 2008 Messages : 13 807 Détails du profil Informations personnelles : Nom : Didier Mouronval Âge : 41 Localisation : France, Gironde (Aquitaine) Informations professionnelles : Activité : Développeur Web Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : juin 2008 Messages : 13 807 Points : 35 797 Points : 35 797	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... __________________ Pas de question technique par MP ! Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi ! Vous possédez un blog et aimeriez diffuser vos billets sur le forum, contactez-moi ! Mes formations video2brain : La formation complète sur JavaScript • JavaScript et le DOM par la pratique • PHP 5 et MySQL : les fondamentaux Mon livre sur jQuery
	00

20/07/2011, 10h10	#12
drumtof Nouveau Membre du Club Inscription : mai 2009 Messages : 135 Détails du profil Informations forums : Inscription : mai 2009 Messages : 135 Points : 32 Points : 32	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.
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email