jquery validation message not showing up

Question

here is my html

<input class="required" id="AcceptTerms" name="AcceptTerms" type="checkbox" value="true" aria-required="true">

here is my JavaScript

//make sure user accepts terms 
$('form').validate({
    rules: {
        AcceptTerms: 'required'
    },
    messages: {
        AcceptTerms: 'You should accept terms in order to proceed'
    }
});

and the error message is 'This field is required.'

why is it not displaying my custom message ?

Answer 1

Form validation runs on submiting form:

You can see complete code example on jsfiddle

<form>
<input class="required" id="AcceptTerms" name="AcceptTerms" type="checkbox" value="true" aria-required="true">
<br/>
<input type="submit" value="Validate!">
</form>

JS code is bellow:

$( 'form' ).validate({
  rules: {
    AcceptTerms : 'required'

  },
  messages: {
      AcceptTerms : 'You should accept terms in order to proceed'
  }
});

Both examples, works, see fiddle .

Answer 2

I have written simple clean JavaScript for you purpose.

<script>
function validate(){
if(!document.getElementById("AcceptTerms").checked)
    alert("You should accept terms in order to proceed!");
else
    alert("Proceed.");
}
</script>
<html>
<label for="AcceptTerms">Accept Terms</label>
<input class="required" id="AcceptTerms" name="AcceptTerms" type="checkbox" aria-required="true"/>
<input type="button" value="Submit" onclick="validate();"/>
</html>

jquery validation message not showing up

Question

2 answers

solution1
2 ACCPTED 2015-08-25 11:12:54

solution2
-1

jquery validation message not showing up

Question

2 answers

solution1 2 ACCPTED 2015-08-25 11:12:54

solution2 -1

solution1
2 ACCPTED 2015-08-25 11:12:54

solution2
-1