How to enable the submit button when I check atleast 1 checkbox?
$("input[name='vehicle']"), submitButt = $("input[name='Submit']");
var checkboxes = $("input[name='vehicle']"),
submitButtList = $("#Submit");
checkboxes.click(function() {
submitButt.attr("disabled", !checkboxes.is(":checked"));
if (!checkboxes.is(":checked")) {
submitButtList.addClass("disabled");
} else {
submitButtList.removeClass("disabled");
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input type="checkbox" name="vehicle" value="Bike"> I have a bike<br>
<input type="checkbox" name="vehicle" value="Car"> I have a car<br>
<input type="submit" value="Submit" disabled>
Here is a JavaScript solution, since you have tagged Javascript and not Jquery
function callFunction() {
var checkboxes = document.querySelectorAll('input[type="checkbox"]');
var checkedOne = Array.prototype.slice.call(checkboxes).some(x => x.checked);
document.querySelectorAll('input[type="submit"]')[0].disabled = true;
if (checkedOne) {
document.querySelectorAll('input[type="submit"]')[0].disabled = false;
}
}
<input type="checkbox" name="vehicle" onchange="callFunction()" value="Bike"> I have a bike<br>
<input type="checkbox" name="vehicle" onchange="callFunction()" value="Car"> I have a car<br>
<input type="submit" value="Submit" disabled>
Jquery solution:
Check the length of checked checkboxes and use prop to disable or enable the button.
$("input[name='vehicle']").on('change', function() {
$("input[type='submit']").prop('disabled', !$("input[name='vehicle']:checked").length);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<input type="checkbox" name="vehicle" value="Bike"> I have a bike<br>
<input type="checkbox" name="vehicle" value="Car"> I have a car<br>
<input type="submit" value="Submit" disabled>
give the same id for the check boxes and write javascript codes on the on click event on the check boxes which enables/disables the button if any one is clicked.
by giving the same name enables only one of the two to be selected
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