Check All by jQuery
Method 1:
$(document).ready(function() {
$('#selectAll').click(function(event) {
if(this.checked) { // check select status
$('.checkbox1').each(function() {
this.checked = true; //select all checkboxes with class "checkbox1"
});
}else{
$('.checkbox1').each(function() {
this.checked = false; //deselect all checkboxes with class "checkbox1"
});
}
});
});
Html
<div>
<input type="checkbox" id="selectAll">Check All
</div>
<div>
<input type="checkbox" class="checkbox1">Home
<input type="checkbox" class="checkbox1">About
<input type="checkbox" class="checkbox1">Page
</div>
Check if checkbox is checked
Example 1 :.
if($('input[type=checkbox]:checked').length>0)
{
alert("please check atleast one");
}
Example 2:
if($('input[type="checkbox"]').is(':checked')){
alert("Please check at least one.");
return false;
}
Method 1:
$(document).ready(function() {
$('#selectAll').click(function(event) {
if(this.checked) { // check select status
$('.checkbox1').each(function() {
this.checked = true; //select all checkboxes with class "checkbox1"
});
}else{
$('.checkbox1').each(function() {
this.checked = false; //deselect all checkboxes with class "checkbox1"
});
}
});
});
Html
<div>
<input type="checkbox" id="selectAll">Check All
</div>
<div>
<input type="checkbox" class="checkbox1">Home
<input type="checkbox" class="checkbox1">About
<input type="checkbox" class="checkbox1">Page
</div>
Method 2:
$("#checkAll").click(function(){
$('input:checkbox').not(this).prop('checked', this.checked);
});
OR
$("#checkAll").click(function() {
$(".checkbox1").prop("checked", $("#checkAll").prop("checked"))
})
});
Html
<div>
<input type="checkbox" id="checkAll">Check All
</div>
<div>
<input type="checkbox" class="checkbox1">Home
<input type="checkbox" class="checkbox1">About
<input type="checkbox" class="checkbox1">Page
</div>
Method 3: If you make multiple check all
<input class="selectAll" type="checkbox" onclick="selectAll(this, this.checked)">
function selectAll(currentcheck, status) {
var parentdiv = $(currentcheck).parents('li:first');
$(parentdiv).find("input:checkbox").prop('checked', true);
if(status === false) {
$(parentdiv).find("input:checkbox").prop('checked', false);
} else {
$(parentdiv).find("input:checkbox").prop('checked', true);
}
}
Check if checkbox is checked
Example 1 :.
if($('input[type=checkbox]:checked').length>0)
{
alert("please check atleast one");
}
Example 2:
if($('input[type="checkbox"]').is(':checked')){
alert("Please check at least one.");
return false;
}
Comments
Post a Comment