Question

I have some code that shows/hides checkboxes using the visibility attribute. If the button is visble, when the form is submitted, I need to somehow ensure that all visible checkboxes are indeed checked.

Here’s my attempt so far:

$("form").submit(function() {
    if ($(':checkbox:visible:not(:checked)').filter(function() {
    return $(this).css('visibility') != 'hidden';
    }).length) {
        alert('return false');
    }
});

The problem seems to be that $(this) after the filter is the form rather than the checkbox.

Any suggestions would be very welcome, than you!

Answer 1

How about this: http://jsfiddle.net/zerkms/WUGh3/1/

if ($('.checkbox:visible:not(:checked)').length) {
    alert('not all visible checkboxes are checked');
    return false;
}

​So you just check if there is any visible checkbox that is not checked. And if so – return false

PS: as adviced by @bažmegakapa the more efficient way of writing the same is:

if ($('.checkbox:not(:checked)').filter(':visible').length) {
    alert('not all visible checkboxes are checked');
    return false;
}