I want to show error message when I click the submit button. So suppose I have 3 checkboxes: (I show one because the other are the same). Please add more code about the form. It is not debuggable at that level. I should have added this as comment, but you can see I don't have enough reputation score.
<label>
<input type="checkbox" name="privacy" value="1" id="privacy" required="required" >
<span class="text-gray" style="font-size: 12px;">
<a href="/privacy-policy/" target="_blank">Privacy</a>
</span>
</label>
All checkboxes have the attribute required="required"
. When I click on the submit button and the checkbox is not selected, I obtain two things:
1) I don't read anything about the "checkbox is empty" that I must read for HTML5 default validation when the attribute is required
2) I obtain this error: An invalid form control with name='privacy' is not focusable.
Anyone can help me?
<script type="text/javascript">
function checkForm(form)
{
if(!form.terms.checked) {
alert("Please indicate that you accept the Terms and Conditions");
form.terms.focus();
return false;
}
return true;
}
</script>
<form onsubmit="return checkForm(this);">
<p><input type="checkbox" name="terms"> I accept the <u>Terms and Conditions</u></p>
<p><input type="submit"></p>
</form>
Use checked so that it will get checked and check the following code i guess it will help you
$(document).ready(function() { $("#submit").click(function() { var chkinput = document.getElementById("privacy"); if (chkinput.checked) { alert("Checked!"); } else { alert ("Not checked"); } }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form> <input type="checkbox" name="privacy" value="1" id="privacy" checked> <span class="text-gray" style="font-size: 12px;"> <a href="/privacy-policy/" target="_blank">Privacy</a><br/> <button id="submit">Submit</button> </span> </form> <form method="post"> <input type="checkbox" name="privacy" value="1" id="privacy1" required="required"> <span class="text-gray" style="font-size: 12px;"> <a href="/privacy-policy/" target="_blank">Privacy</a><br/> <button>Submit</button> </span> </form>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.