Check for atleast one filled field in jQuery/javascript

Question

Check if atleast one field is not empty in PHP

is very equal to this question. This is just how to do it in javascript.

When you click on #submit it should check atleast one of these fields:

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

are filled, and not empty. If all of them are empty, it should alert("Please fill one of the fields")

Update: forgot to mention that if the fields are 0 it should not be counted as filled.

How can i do this? I tried copy over from php, but i get stuck on the foreach loop

lonesomeday · Accepted Answer · 2011-09-14 15:43:52Z

3

You could do this very easily with the filter method:

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")
}

What this does:

Selects all the elements you want to check
Runs the filter method: if you return true, the element will be kept; if you return false, it will be removed from the selection
- !!this.value is true if the value is a non-empty string and otherwise is false
We then check the length property of the selection. If it is not 0, at least one element has a non-empty value. If it is 0, they are all empty.

See:

edited Sep 14, 2011 at 15:43

answered Sep 14, 2011 at 15:37

lonesomeday

239k54 gold badges330 silver badges329 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Karem Over a year ago

I forgot to mention if its 0 it should not be counted as filled

genesis · Accepted Answer · 2011-09-14 15:38:08Z

0

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');
}

answered Sep 14, 2011 at 15:38

genesis

51.1k20 gold badges99 silver badges127 bronze badges

Comments

jmar777 · Accepted Answer · 2011-09-14 15:41:41Z

0

$('#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;
    }
});

answered Sep 14, 2011 at 15:41

jmar777

39.8k11 gold badges68 silver badges66 bronze badges

Collectives™ on Stack Overflow

Check for atleast one filled field in jQuery/javascript

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related