How can I ensure at least one checkbox is checked in a particular div?

Question

I have a <div class="answer" id="yesOptions"> and I need to check that at least 1 checkbox inside this particular is checked. If not, I need to return alert('At least 1 checkbox must be checked from this div!');

How can I do this?

Answer 1

How about

var checkedboxes = $('#yesOptions :checkbox:checked').length;

if (checkedboxes === 0){
    alert('At least 1 checkbox must be checked from this div!');
}

Demo at http://jsfiddle.net/f8UhA/

Answer 2

Working demo http://jsfiddle.net/gvbX5/

You can use grouping, like sample code below and demo above, hope it helps the cause.

Good links:

What is the proper way to uncheck a checkbox in jQuery 1.7?

JQuery - is at least one checkbox checked

code

$('input').change(function() {
    if ($("[name=group1]:checked").length > 0){

    }else{
        alert('select atleast one checkbox');
    }
});

 if ($("[name=group1]:checked").length == 0)
        alert('select atleast one checkbox');


<input type="checkbox" name="group1" value="1"/>
<input type="checkbox" name="group1" value="2" />
<input type="checkbox" name="group1" value="3" />​
​

Answer 3

$("input[type=checkbox]:checked", $("#yesOptions")).length will give you the count of checkboxes that is checked within that div.

Answer 4

You can actually just do:

if (!$("[type='checkbox']", "#yesOptions").is(':checked'))​ 
    alert('At least 1 checkbox must be checked from this div!');​

FIDDLE1

FIDDLE2