IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Plusieurs formulaires identiques différentiés par une clef sur un même document


Sujet :

JavaScript

  1. #1
    Membre confirmé
    Homme Profil pro
    Ingénieur en électrotechnique retraité
    Inscrit en
    décembre 2008
    Messages
    1 176
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 70
    Localisation : France, Ain (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur en électrotechnique retraité

    Informations forums :
    Inscription : décembre 2008
    Messages : 1 176
    Points : 605
    Points
    605
    Par défaut Plusieurs formulaires identiques différentiés par une clef sur un même document
    Bonjour,

    Sur un même document, j'ai plusieurs formulaires identiques différentiés par une clef. Je n'arrive pas à lire la valeur d'un champ de l'un des formulaires.
    Code source:
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    <form method="post" name="tabForm" action="http://sirep.proginet.local/frontend/mainFormHandler.php" data-tab="employee" data-key="0">
    	<input type="text" id="id0" name="0[id]" value="110"> <!-- Remplacer le type par 'hidden' -->
    	<label for="firstname0">Prénom</label><input type="text" id="firstname0" name="0[firstname]" value="Jean-Michel"><br>
    </form>
     
    <form method="post" name="tabForm" action="http://sirep.proginet.local/frontend/mainFormHandler.php" data-tab="employee" data-key="1">
    	<input type="text" id="id1" name="1[id]" value="297"> <!-- Remplacer le type par 'hidden' -->
    	<label for="firstname1">Prénom</label><input type="text" id="firstname1" name="1[firstname]" value="Marie-Jeanne"><br>
    </form>
    Code JS : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    const tabForms	= document.querySelectorAll("[name='tabForm']");
     
    if(tabForms.length){
    	tabForms.forEach(function(curForm, index){ // voir utilité de index
    		curForm.addEventListener('change', function(e) {
    		if (e.target.nodeName === 'INPUT' || e.target.nodeName === 'SELECT' || e.target.nodeName === 'TEXTAREA') {
    			let idId = 'id'+this.dataset.key;
    			}
    		}, false );
    	});
    }
    Je n'arrive pas à lire la valeur du champ défini par idId à la ligne 7.

  2. #2
    Responsable LaTeX

    Avatar de -Nikopol-
    Homme Profil pro
    Développeur Web
    Inscrit en
    mai 2013
    Messages
    2 127
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Haute Marne (Champagne Ardenne)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : Enseignement

    Informations forums :
    Inscription : mai 2013
    Messages : 2 127
    Points : 11 188
    Points
    11 188
    Billets dans le blog
    5
    Par défaut
    le data-key est un attribut de ton form, là tu le cherches dans e.target qui ici est un enfant du form. En prenant let idId = 'id' + curForm.dataset.key; tu devrais obtenir ce que tu veux.

  3. #3
    Membre confirmé
    Homme Profil pro
    Ingénieur en électrotechnique retraité
    Inscrit en
    décembre 2008
    Messages
    1 176
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 70
    Localisation : France, Ain (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur en électrotechnique retraité

    Informations forums :
    Inscription : décembre 2008
    Messages : 1 176
    Points : 605
    Points
    605
    Par défaut
    Si je fais console.log(this); et console.log(curForm); j'obtiens exactement le même résultat, c'est à dire le même élément form.
    Dans les deux cas idId vaut id0 (ou id1 selon le formulaire cliqué) et je n'arrive pas à accéder à la valeur de cet élément idId.

  4. #4
    Modérateur
    Avatar de ProgElecT
    Homme Profil pro
    Retraité
    Inscrit en
    décembre 2004
    Messages
    5 648
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 65
    Localisation : France, Haute Savoie (Rhône Alpes)

    Informations professionnelles :
    Activité : Retraité
    Secteur : Communication - Médias

    Informations forums :
    Inscription : décembre 2004
    Messages : 5 648
    Points : 14 576
    Points
    14 576
    Par défaut
    Salut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    let idId = 'id' + curForm.dataset.key;
    console.log("document.getElementById(idId).value = " + document.getElementById(idId).value)
    ?
    Soyez sympa, pensez -y
    Balises[CODE]...[/CODE]
    Balises[CODE=NomDuLangage]...[/CODE] quand vous mettez du code d'un autre langage que celui du forum ou vous postez.
    Balises[C]...[/C] code intégré dans une phrase.
    Balises[C=NomDuLangage]...[/C] code intégré dans une phrase quand vous mettez du code d'un autre langage que celui du forum ou vous postez.
    Le bouton en fin de discussion, quand vous avez obtenu l'aide attendue.
    ......... et pourquoi pas, pour remercier, un pour celui/ceux qui vous ont dépannés.
    👉 → → Ma page perso sur DVP ← ← 👈

  5. #5
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    janvier 2011
    Messages
    15 602
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : janvier 2011
    Messages : 15 602
    Points : 39 631
    Points
    39 631
    Par défaut
    Bonjour,
    si ta structure est toujours la même, à savoir ton <input> en premier enfant, alors il suffit de faire un :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    console.log(this.firstElementChild.value);

  6. #6
    Membre confirmé
    Homme Profil pro
    Ingénieur en électrotechnique retraité
    Inscrit en
    décembre 2008
    Messages
    1 176
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 70
    Localisation : France, Ain (Rhône Alpes)

    Informations professionnelles :
    Activité : Ingénieur en électrotechnique retraité

    Informations forums :
    Inscription : décembre 2008
    Messages : 1 176
    Points : 605
    Points
    605
    Par défaut
    Merci à vous deux
    @NoSmoking:
    A priori, il n'y a pas de raison que la structure change mais par précaution pour préserver l'avenir dans la suite du développement, je préfère la solution de @ProgElecT.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 2
    Dernier message: 16/10/2014, 17h19
  2. Réponses: 5
    Dernier message: 10/05/2008, 19h11
  3. Réponses: 2
    Dernier message: 10/05/2008, 18h53
  4. Réponses: 11
    Dernier message: 27/06/2006, 16h05
  5. ouvrir plusieurs formulaires identiques
    Par Australia dans le forum Access
    Réponses: 5
    Dernier message: 21/04/2006, 12h56

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo