Vérifier atleast un champ rempli jQuery/javascript

Question

Check if atleast one field is not empty in PHP

est égale à cette question. C'est juste comment le faire en javascript.

Lorsque vous cliquez sur #submit il faut cocher au moins un de ces champs:

input[name=weight], input[name=size_1], input[name=size_2], input[name=size_3] 

sont remplies, et non vide. Si tous sont vides, il faut alert (« S'il vous plaît remplir un des champs »)

Mise à jour: a oublié de mentionner que si les champs sont 0, il ne doit pas être considéré comme rempli.

Comment est-ce que je peux faire ceci? J'ai essayé copie au-dessus de php, mais je suis bloqué sur la boucle foreach

Answer 1

Vous pouvez le faire très facilement avec la méthode filter:

var filledFields = $('input[name=weight], input[name=size_1], input[name=size_2], input[name=size_3]') 
    .filter(function() { 
     return !!this.value && this.value !== '0'; // remove if value is empty or 0, keep otherwise 
    }); 

if (filledFields.length) { 
    // at least one element has a value set 
} else { 
    // no fields have values set 
    alert("Please fill one of the fields") 
} 

Ce que ceci:

1. Sélectionne tous les éléments que vous souhaitez vérifier
2. Exécute la méthode filter: si vous renvoyez true, l'élément sera conservé; si vous revenez faux, il sera retiré de la sélection
   • !!this.value est true si la valeur est une chaîne non vide et est par ailleurs faux
3. Nous vérifions ensuite la propriété length de la sélection. Si ce n'est pas 0, au moins un élément a une valeur non vide. Si c'est 0, ils sont tous vides.

Voir:

• filter
• length

Answer 2

if (!$("input[name=weight]").val() && !$("input[name=size_1]").val() && !$("input[name=size_2]").val() && !$("input[name=size_3]").val()){ 
    alert('Please fill one of the fields'); 
} 

Answer 3

$('#my-form').submit(function() { 
    var fields = $(this).find('input[name=weight]', 'input[name=size_1]', 'input[name=size_2]', 'input[name=size_3]'); 
    if (!$fields.filter(function() { return !!$(this).val(); }).length) { 
     alert('Please fill one of the fields'); 
     return false; 
    } 
});