[RESOLU] Afficher une liste déroulante ou une textarea suite à un clique sur un bouton radio.

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : [RESOLU] Afficher une liste déroulante ou une textarea suite à un clique sur un bouton radio.

Re: Afficher une liste déroulante ou une textarea suite à un clique sur un bouton radio.

par wisefun77 » 26 sept. 2022, 13:33

Bonjour two3D,

Effectivement j'ai encore fait une grosse boulette.
Maintenant je comprends mieux le code.
Merci de tout cœur pour tes explications.

Re: Afficher une liste déroulante ou une textarea suite à un clique sur un bouton radio.

par two3d » 26 sept. 2022, 09:30

L'erreur est en rouge :

let OuiInput = document.querySelector('[name="commentoui"]');
// On va intercepter les événements "change" du bouton radio
// Cela correspond à un changement d'option sélectionnée
commentoui.addEventListener('change', function() {


commentoui n'existe pas, OuiInput existe.

Afficher une liste déroulante ou une textarea suite à un clique sur un bouton radio.

par wisefun77 » 21 sept. 2022, 14:52

Bonjour,
J'aimerai faire en sorte que lorsque l'user sélection un bouton radio, cela affiche en dessous soit une liste déroulante soit une textarea.
ex:
Ajouter un commentaire
OUI NON
Si oui coché alors afficher en dessous une textarea.
j'ai essayé ce code , sans résultat.

Code : Tout sélectionner

<td> Ajouter un commentaire ? <br/> <input type="radio" name="commentnon" value="SANS COMMENTAIRE"> <label>NON</label> &emsp; <input type="radio" name="commentoui" value="Oui"> <label>OUI</label> <br/> <div id="new-comment-group" style="display: none;"> <textarea name="new-comment" id="new-comment" require maxlength="17" tabindex="20"></textarea> </div> </td> <script> let OuiInput = document.querySelector('[name="commentoui"]'); // On va intercepter les événements "change" du bouton radio // Cela correspond à un changement d'option sélectionnée commentoui.addEventListener('change', function() { // On cache les assets par défaut document.querySelector('#new-comment-group').style.display = 'none'; document.querySelector('#new-comment-group textarea').removeAttribute("required"); // Si la valeur du select est OUI alors on affiche la textarea if(this.value === 'Oui') { document.querySelector('#new-comment-group').style.display = 'block'; document.querySelector('#new-comment-group textarea').setAttribute("required","required"); } }); </script>
Merci.