I have an page with multiple checkboxes.
Each record I embedded checkboxes for months and CHECK ALL button at the end. When I select this button, all checkboxes of all months of specific record must be selected. How can I do this?
Try this
$(document).ready(function(){
$('#select_all').on('click',function(){
if(this.checked){
$('.checkbox').each(function(){
this.checked = true;
});
}else{
$('.checkbox').each(function(){
this.checked = false;
});
}
});
$('.checkbox').on('click',function(){
if($('.checkbox:checked').length == $('.checkbox').length){
$('#select_all').prop('checked',true);
}else{
$('#select_all').prop('checked',false);
}
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- check box value for input -->
1<input type="checkbox" class="checkbox" name="checkboxlist" value=""/>
2<input type="checkbox" class="checkbox" name="checkboxlist" value=""/>
3<input type="checkbox" class="checkbox" name="checkboxlist" value=""/>
4<input type="checkbox" class="checkbox" name="checkboxlist" value=""/>
<br><br>
<!-- check box for check all -->
<span>select all:</span>
<input type="checkbox" id="select_all" />