Jquery stop form submit unless checkbox selected
I've got this code, but it doesn't seem to return true. The alert always shows up. Any thoughts (without needing to create a var in which to store that a checkbox has been selected as that just seems a bit hacky).
Thanks.
$("#form").submit(function(e) {
$('input[type=checkbox]').each(function () {
if(this.checked){
return true;
}
});
alert("Please select at least one to upgrade.");
return f开发者_JS百科alse;
});
You don't need to do the loop to determine if a checkbox is checked. The :checked
selector filters out all that are not checked. Then you can use $.length
to get a count of the checked inputs.
$("#form").submit(function(e) {
if(!$('input[type=checkbox]:checked').length) {
alert("Please select at least one to upgrade.");
//stop the form from submitting
return false;
}
return true;
});
Additionally, using your approach, a small change should make this work
$("#form").submit(function(e) {
$('input[type=checkbox]').each(function () {
if($(this).is(':checked')){
return true;
}
});
alert("Please select at least one to upgrade.");
return false;
});
I think you may be simply missing the $()
around this
Just to point out, you're using the id reference #form
. Did you mean to just refer to all forms, or does the form have the id form
?
Example of checking the number of checboxes checked...
<script>
function countChecked() {
var n = $("input:checked").length;
$("div").text(n + (n <= 1 ? " is" : " are") + " checked!");
}
countChecked();
$(":checkbox").click(countChecked);
</script>
Above "$("input:checked")" returns the array of checked items... You could check the "length" of this array for being > 0.
Code for click and enter the submit button :
$(":input").bind("click keypress", function(evt) {
var keyCode = evt.which || evt.keyCode;
var sender = evt.target;
if (keyCode == 13 || sender.type == "submit") {
evt.preventDefault();
// add your validations
}
// and submit the form
}
var atleast = 1;
function validate() {
debugger;
var CHK = document.getElementById("<%=chk1");
var checkbox = document.getElementsByTagName("input");
var counter = 0;
for (var i = 0; i < checkbox.length; i++) {
if (checkbox[i].checked) {
counter++;
}
}
if (atleast > counter) {
alert("Please select atleast " + atleast + " employee ");
return false;
}
return true;
}
<button type="submit" name="Initiate" value="Initiate" on click="return validate()" id=" initiate"></button>
精彩评论