faire un champ de saisie obligatoire si la radio est coché

Je peux en quelque sorte insérer l'attribut obligatoire dans un champ de saisie que si une radio est-elle vérifiée?

J'ai un champ de saisie nommé "l'échelle de compteurs" qui n'a pas à être rempli par défaut. Mais si l'utilisateur coche un bouton radio nommé "l'échelle" de la "échelle, mètres de" champs doivent être remplis.

Mon entrée ressemble à ceci:

<input type="text" name="ladder-meters" id="ladder-meters">

et devrait de ce genre à l'événement onchange sur la radio

<input type="text" name="ladder-meters" id="ladder-meters" required>

OriginalL'auteur Morten Hagh | 2012-08-15

  1. 12

    Facile à réaliser avec jQuery:

    $('#ladder').change(function () {
    if($(this).is(':checked') {
        $('#ladder-meters').attr('required');
    } else {
        $('#ladder-meters').removeAttr('required');
    }
});
    Utilisé cette! Il fonctionne comme prévu 🙂 Merci!
    Sept alambiqué lignes de jQuery sera toujours mieux que 3 lignes de plain ol' javascript. Note à moi-même: doit inclus plus de bibliothèques.
    3 lignes de plaine JavaScript qui ne fonctionne pas dans les anciennes versions d'IE. Il permettra d'augmenter en nombre de lignes que vous ajoutez en fonction détecte pour addEventListener puis ajouter le attachEvent version. Cela dit, il n'y a aucune mention de jQuery dans la question, donc il ne devrait pas vraiment avoir de jQuery réponses.
    Vrai. Et vrai.

    OriginalL'auteur F. Orvalho

  2. 16
    document.getElementById("ladder").addEventListener('change', function(){
    document.getElementById("ladder-meters").required = this.checked ;
})

    Chaque fois que la case à cocher est cliqué, l'attribut requis sera modifiée pour correspondre à l'objet de l'attribut de la case. Pour inverser cette relation, remplacer this.checked avec !this.checked

    Cela peut nécessiter certains ajustements pour s'adapter à votre projet.

    Ce sera de travailler avec cette case à cocher:

    <input type='checkbox' id='ladder' name='ladder' />

    OriginalL'auteur ColBeseder

  3. 15

    Essayé F. Orvalho, ne fonctionne pas pour moi, j'ai eu à utiliser

    $('#ladder').change(function () {
    if(this.checked) {
        $('#ladder-meters').prop('required', true);
    } else {
        $('#ladder-meters').prop('required', false);
    }
});

    Il pourrait être utile. Merci à F. Orvalho pour la structure

    OriginalL'auteur lordyoum