I have a form where I am using Jquery validate for client side validations. I have also used a google recaptcha in the form. The problem here is, I want to run client side validations on the reCaptcha div so that the user does not leave it unchecked. I have a function which validates the recaptcha but I am not able to run it simultaneously with the validate. I have to explicitly mention it in my submitHandler
of the validate. Below is my code snippet:
$('#newform').validate({
'rules': {
'name': {
required: true
},
'age': {
required: true,
number: true
}
},
'messages': {
'name': {
required: 'Name is required'
},
'age': {
required: 'Age is required',
number: 'Age must be a number'
}
},
'submitHandler': function(form) {
recaptcha_validate(form); //This runs the validation on the reCaptcha
}
});
<form id="newform" enctype="multipart/form-data" method="post" action="">
<input type="text" name="name" placeholder="name"></input><br/>
<input type="text" name="age" placeholder="age"></input><br/>
<input type="file" id="fileupload" name="file"/><br/>
<div class="g-recaptcha" data-sitekey="site-key"></div>
<span id="captcha_error"/> <!-- Displays the error message for captcha -->
<input type="submit" name="send" value="Send"></input>
</form>
My question: Is it possible to run the captcha validation function at the same time as the actual validation handlers run? Currently the captcha validation runs after all the fields are validated, since it is written in the submitHandler
.
reCaptcha validation function courtesy THIS post.