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 :

Permutation du type d'un input (password -> text)


Sujet :

JavaScript

  1. #1
    Membre du Club
    Homme Profil pro
    IDE
    Inscrit en
    janvier 2015
    Messages
    36
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Loire (Rhône Alpes)

    Informations professionnelles :
    Activité : IDE

    Informations forums :
    Inscription : janvier 2015
    Messages : 36
    Points : 52
    Points
    52
    Par défaut Permutation du type d'un input (password -> text)
    Bonjour,

    Je convertis (péniblement) mes scripts old school jQuery en vanilla js et je rencontre un problème. Je veux que mon script change l'attribut type d'un imput password en 'text' en appuyant sur un bouton :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    // from:
    <input type="password" name="password"/>
    // to:
    <input type="text" name="password"/>
    Le bouton - un lien pour l'instant on verra après - est créé en JS. Jusque là tout va bien, mais ensuite je n'arrive pas à permuter avec un click :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    see.onclick = seePassword(input); // <- comportement attendu : changement d'attribut en 'text' si clique sur l'élement frère
    Le code complet : CodePen

    Pour l'instant tous les inputs password de la page passent en type='text'.

    Voilà voilà, si quelqu'un pouvait m'aider à y voir plus clair...

  2. #2
    Expert confirmé Avatar de psychadelic
    Profil pro
    Inscrit en
    mai 2010
    Messages
    2 529
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : mai 2010
    Messages : 2 529
    Points : 4 678
    Points
    4 678
    Par défaut
    simplement en utilisant set / get Attribute

    Code HTML : 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
    <form id="my-form">
      <input type="password" name="password"/>
     
      <button name="btPsw" type="button" >voir mot de passe On/off</button>
    </form>
     
      <script>
     
    const myForm = document.getElementById('my-form')
     
    myForm.btPsw.onclick=_=>
      {
      let nvType = (myForm.password.getAttribute('type') === 'password') ? 'text' : 'password'
      myForm.password.setAttribute('type', nvType) 
      }
     
    myForm.onsubmit=e=>e.preventDefault()
    «La pluralité des voix n'est pas une preuve, pour les vérités malaisées à découvrir, tant il est bien plus vraisemblable qu'un homme seul les ait rencontrées que tout un peuple.» [ René Descartes ] - Discours de la méthode

  3. #3
    Membre du Club
    Homme Profil pro
    IDE
    Inscrit en
    janvier 2015
    Messages
    36
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Loire (Rhône Alpes)

    Informations professionnelles :
    Activité : IDE

    Informations forums :
    Inscription : janvier 2015
    Messages : 36
    Points : 52
    Points
    52
    Par défaut
    Je vois ce qui manquait chez moi : il manquait les accolades autour de la fonction :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    see.onclick = {
      seePassword(input);
    }
    Merci pour votre aide.

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

Discussions similaires

  1. modifier le type d'un input de file à texte avec IE
    Par damjal dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 30/09/2008, 17h50
  2. [Sécurité] Comment crypter input password ?
    Par stringman62 dans le forum Langage
    Réponses: 15
    Dernier message: 04/04/2007, 10h56
  3. modification du type d'un input onfocus
    Par phoeniix07 dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 24/03/2007, 16h46
  4. Changement type d'un input sous IE
    Par Orni dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 30/11/2006, 09h34

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