aspose file tools*
The moose likes Web Services and the fly likes jQuery: how to determine if any checkbox is checked. Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


Win a copy of Spring in Action this week in the Spring forum!
JavaRanch » Java Forums » Java » Web Services
Bookmark "jQuery: how to determine if any checkbox is checked. " Watch "jQuery: how to determine if any checkbox is checked. " New topic
Author

jQuery: how to determine if any checkbox is checked.

Dennis Spring
Greenhorn

Joined: Apr 07, 2010
Posts: 12
How do you determine if there are any checkboxes in an html form that are checked?
You can copy these 2 scripts into2 files, and try this solution.
Note: The html script assumes that you have jquery-1.2.1.js and ds_jq.js in a folder
up one level called 'scripts'. You can un-rem the alert on the js page to confirm that
the html page 'sees' the js page.


The code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!-- ckbox_testpage.html -->
<!-- Dennis Spring, Charlotte, NC USA 2010-04-07 -->
<html>
<head>
<script type="text/javascript" src="../scripts/jquery-1.2.1.js"></script>
<script type="text/javascript" src="../scripts/ds_jq.js"></script>
<script type="text/javascript">
$(function(){
$(':checkbox').click(function(){
// if the wrapped set has any elements in it...
if ($('input:checkbox:checked').length > 0){
// do some work...
alert("head-script: There is a Checked checkbox.");
}
});
});
</script>
</head>
<body>
<div id="formDiv">
<form action="another_page.html" method="POST" id="frm1">
I like dogs: <input type="checkbox" name="likeDogs" value="likes dogs"/>
I like cats: <input type="checkbox" name="likeCats" value="likes cats"/><br/>
</form>
</div>
</body>
</html>
********************************

// ds_jq.js
// Dennis Spring, Charlotte, NC USA 2010-04-07

jQuery(document).ready(function() {

//alert("ds_jq.js found!");

if ($('input:checkbox:checked').length > 0) {
// do some work...
alert("js include: There is a Checked checkbox.");
}

});

Issue:
I first tried the following syntax to determine if there existed a checked checkbox:
if ($('input:checkbox:checked')) alert("There is a Checked checkbox.");
But even when no box was checked, the decision tested true, and the Alert window popped up.

Sheriff Bibeault enlightened me with this explanation:
"
Your if test will always return true. The $() function is returning a jQuery wrapped set, even if
that wrapped set is empty.
Make your test more crisp and explicit:
if ($('input:checkbox:checked').length > 0)
"

Using that code does the trick. Try it.
Load the page into your browser (your url might be something like http://localhost/htdocs/ckbox_test_page.html).
Note that no js Alert window popped up. Neither checkbox was checked, so this was expected.
Click in a checkbox. The Alert window indicates that the click handler in the head of the html page executed.
Next, click the Refresh button on your browser; the Alert window indicates that the ready handler script in ds_jq.js fired.
Click the other checkbox: again the local function executes.
Finally, click one of the checkboxes again, un-checking it.
Note that the html page javascript fires again, because there is still one checkbox checked.
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61413
    
  67

Welcome to the Ranch!

To keep your posts with code readable please read: UseCodeTags.


[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: jQuery: how to determine if any checkbox is checked.