7
votes

Pour désactiver un bouton d'envoi si les champs vides de jQuery

Comment pouvez-vous désactiver l'envoi -button s'il y a une ou plusieurs apports d'entrée -Fields vides? strong>

ma tentative de pseudo-code strong> p> xxx pré>

J'ai lu ces articles sans trouver une solution de droite p>

  1. Documents officiels sur vide : Ceci n'est pas pertinent car il cherche toute entrée - champs li>
  2. Un fil à propos de handicapé-réalité à JQuery : Cela semble être pertinent li>
  3. Pour pouvoir tester JQuery Firefox / Terminal : Obtenir un environnement de test m'aiderait le plus li> ol>

    J'utilise pour le moment le code suivant. Il contient un bogue sur le caractère ; code>, mais je ne trouve pas de le trouver. P>

    # 1 h1>
    $(document).ready(function(){
        var inputs = $('input', '#ask_form'), empty = false;
        // can also use :input but it will grab textarea/select elements and you need to check for those..
    
        inputs.each(function() {
            if ( $(this).val() == '' ) {
                empty = true;
                return;
            }
        });
    
        if ( empty ) {
            $('.ask_question').attr('disabled', 'disabled'); // or true I believe.
        }
    });
    


0 commentaires

4 Réponses :


2
votes

1 commentaires

Merci pour les liens! J'utilise le code dans la démonstration pour le moment. Il y a un bogue dans mon code de la question.



10
votes
var $submit = $("input[type=submit]");
if ( $("input:empty").length > 0 ) {
   $submit.attr("disabled","disabled");
} else {
   $submit.removeAttr("disabled");
}

8 commentaires

Assurez-vous simplement de mettre cela dans un événement ONCHANGE ou similaire afin de vous déclenchera chaque fois qu'un champ est modifié.


Votre code désactive les boutons. Cependant, il désactive aussi des boutons lorsque les champs ne sont pas vides. - Comment lisez-vous ceci entrée: vide) .Length> 0 en anglais? - Ma tentative d'appliquer la règle donnée à la balise entrée Ce qui est vide de sorte que sa longueur soit supérieure à zéro. - Cela n'a pas de sens pour moi, car ma considération conduit à une contradiction.


J'ai supprimé .length> 0 , mais les boutons restent désactivés.


Ce que cela fait obtient une collection de tous les éléments d'entrée qui n'ont pas d'enfants, y compris des nœuds de texte. La propriété détermine simplement le nombre d'articles dans la collection. S'il y a 0 éléments dans la collection, la longueur sera 0. Vous pouvez évidemment être plus spécifique dans votre sélecteur, comme $ ("INPUT.MYInPUTS: vide") Mais cela devrait faire l'affaire.


J'ai mis à jour mon code de sorte que si tout va bien, mais précédemment n'était pas, le bouton devient activé à nouveau.


Votre code est toujours buggy: il ne désactive aucun bouton cette fois. Pourquoi avez-vous changé $ ("entrée [type = Soumettre]"). attr (désactivé "," désactivé "); à` $ Soumettre.attr ("désactivé", désactivé ");"? - J'exécute votre code aussi avec une modification de votre dernier code à votre ancien code, mais le même problème persiste.


Regardez, Masi, ça ne va pas travailler Verbatim. Je vous donne le cadre pour construire sur. Vous devez insérer les sélecteurs qui sont pertinents pour votre système. j'ai sorti var $ soumettre = $ ("entrée [type = soumettre]"); pour que je n'ai pas eu à me répéter et aussi que la collection soit appelée une seule fois, ce qui sera accéléré le processus.


Si vous souhaitez revenir en arrière et mettre dans $ ("entrée [type = soumettre]"); à la place de $ Soumettre il fonctionnera de la même manière. Allez-y.



0
votes
var inputs = $('input', 'form#foo'), empty = false;
// can also use :input but it will grab textarea/select elements and you need to check for those..

inputs.each(function() {
    if ( $(this).val() == '' ) {
        empty = true;
        return;
    }
});

if ( empty ) {
    $('#el').attr('disabled', 'disabled'); // or true I believe.
}

1 commentaires

Votre code a le même problème que Jason. Il désactive le envoyer -Button de manière permanente.



-1
votes

manquer la fermeture, essayez ceci par exemple # 1: xxx


0 commentaires