How to Check Atleast One Checkbox is Checked or Not in JQuery?
Hi
In this tutorial, i will show you how to check atleast one checkbox is checked or not in jquery. i explained simply step by step at least one checkbox checked validation in jquery. you can see jquery at least one checkbox checked. This post will give you simple example of jquery validate at least one checkbox checked.
Here, i will give you very simple example with list of colors checkboses and you must have to select at least one color from list, if you do not select then it will give you validation alert.
let's see bellow example:
index.html
<!DOCTYPE html>
<html>
<head>
<title>How to check atleast one checkbox is checked or not in JQuery - ItSolutionStuff.com</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div>
<h1>How to check atleast one checkbox is checked or not in JQuery - ItSolutionStuff.com</h1>
<strong>Colors:</strong>
<input type="checkbox" value="true" class="color-check" name="colors[]"> Red
<input type="checkbox" value="true" class="color-check" name="colors[]"> Blue
<input type="checkbox" value="true" class="color-check" name="colors[]"> Black
<input type="checkbox" value="true" class="color-check" name="colors[]"> Orange
<button class="submit">Submit</button>
</div>
<script type="text/javascript">
$(".submit").click(function(){
if ($('.color-check').filter(':checked').length < 1){
alert("Please Check at least one Color Box");
return false;
}else{
alert("Proceed");
}
});
</script>
</body>
</html>
Output:
i hope it can help you...
