Menu
I simply want to check all of the check boxes on a page if a user clicks the "Select All" button.
In the body:
<button id="checkall">Select All</button>
jQuery:
<head>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#checkall').click(function () {
$("input[type=checkbox]").each( function() {
$(this).attr('checked', true);
});
});
</script>
</head>
And the checkboxes are generated by a little bit of php:
echo '<li>';
echo '<input type="checkbox" name="checkbox[]" value="'.$x.'" />'.$x.'<br/>';
echo '</li>';
Can anyone tell me what I'm doing wrong?
410
You dont need the each statement. Just select all checkboxes and set the property checked = true.
$(document).ready(function(){
$('#checkall').click(function () {
$("input:checkbox").prop('checked', true);
});
});
Note jQuery.prop() is a feature added to 1.6 and up. If you are on a version of jQuery prior to 1.6 you will need the following.
$(document).ready(function(){
$('#checkall').click(function () {
$("input:checkbox").attr('checked','checked');
});
});
Instead of selecting checkbox with tag name better assign it some class and select it with classname
$(document).ready(function(){
$('#checkall').click(function () {
$(".checkbox").each( function(i,chkbox) {
$(chkbox).attr('checked', true);
});
});
});
php code
echo '<li>';
echo '<input type="checkbox" class="checkbox" name="checkbox[]" value="'.$x.'" />'.$x.'<br/>';
echo '</li>';
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
