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 :

Manipuler plusieurs champs en même temps selon une condition


Sujet :

JavaScript

  1. #1
    Nouveau membre du Club
    Profil pro
    Inscrit en
    Janvier 2014
    Messages
    46
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2014
    Messages : 46
    Points : 32
    Points
    32
    Par défaut Manipuler plusieurs champs en même temps selon une condition
    Bonjour.

    Ci-dessous mon code HTML:
    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    <tr>
    <td>Nom1</td>
    <td>Prenom1</td>
    <td id="54789">pseudo1</td>
    </tr>
    <tr>
    <td>Nom2</td>
    <td>Prenom1</td>
    <td id="65412">pseudo2</td>
    </tr>
    Les deux ont le même prénom.

    Plus loin, un bouton qui permet de modifier le champ du pseudo.
    Ce bouton appelle une fonction JavaScript qui contient:
    Code JavaScript : Sélectionner tout - Visualiser dans une fenêtre à part
    document.getElementById("id du champ pseudo").innerText = "nouveau";

    Mais que mettre dans "id du champ pseudo"?
    Je souhaite que la fonction JavaScript modifie tous les champs 'pseudo' qui ont le même prénom.

    Comment faire?

    Merci.

  2. #2
    Membre expérimenté
    Avatar de ryan
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2003
    Messages
    956
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Juin 2003
    Messages : 956
    Points : 1 316
    Points
    1 316
    Billets dans le blog
    1
    Par défaut
    Yop!

    Dans la mesure où tu comptes modifier plusieurs cellules (c'est un tableau, pas un formulaire donc on parle de cellules ), tu devras passer par un array.

    Une solution parmi d'autres serait de donner une classe aux td qui sont susceptibles de contenir les données que tu veux modifier:
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <td class='prenom'>Prenom1</td>

    et de les récupérer dans un array via document.getElementByClassName("prenom"), une petite boucle for, un test sur le prénom que tu veux remplacer, et voilà.
    Un ascenseur est une machine qui passe quand même la moitié de son temps à descendre.

  3. #3
    Modérateur

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

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 959
    Points : 44 122
    Points
    44 122
    Par défaut
    Bonjour,
    ...via document.getElementByClassName("prenom")...
    autant utiliser querySelectorAll.

  4. #4
    Membre habitué
    Profil pro
    Inscrit en
    Septembre 2007
    Messages
    125
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Septembre 2007
    Messages : 125
    Points : 149
    Points
    149
    Par défaut
    A propos de tes id, un id ne devrait pas être composé uniquement ou commencer par un nombre.

  5. #5
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2008
    Messages
    23 647
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 53
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juin 2008
    Messages : 23 647
    Points : 91 220
    Points
    91 220
    Billets dans le blog
    20
    Par défaut
    Techniquement, HTML5 l'autorise, mais ça pose quand même des problèmes au niveau CSS notamment.

    Citation Envoyé par ryan
    via document.getElementByClassName("prenom")
    Personnellement, je préfère utiliser des méthodes qui existent, par exemple getElementsByClassName().
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  6. #6
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 637
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 637
    Points : 66 661
    Points
    66 661
    Billets dans le blog
    1
    Par défaut
    attention à la terminologie .. un td n'est pas à proprement parler un "champs"...
    On parle plutôt de champs pour un input coté html

    Sinon jQuery peut te simplifier la tache avec une puissance de sélecteurs qui te permettra de cibler aisément les éléments voulus...
    Ma page Developpez - Mon Blog 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

    Venez sur le Chat de Développez !

Discussions similaires

  1. [2008R2] mise a jour automatique de plusieurs champs en même temps
    Par Nephi dans le forum Développement
    Réponses: 2
    Dernier message: 18/02/2013, 10h30
  2. Modification plusieurs champs en même temps
    Par stevenP dans le forum Requêtes
    Réponses: 1
    Dernier message: 06/12/2012, 16h17
  3. [AC-2007] affecter une valeur à plusieurs champs en même temps
    Par pepper18 dans le forum Requêtes et SQL.
    Réponses: 3
    Dernier message: 21/01/2010, 11h11
  4. changer le type de données de plusieurs champs en même temps
    Par djerbafr dans le forum Modélisation
    Réponses: 1
    Dernier message: 05/08/2008, 15h34
  5. Réponses: 3
    Dernier message: 17/07/2007, 09h44

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