Updated Que: I am trying to validate the invisible Google Recaptcha after form validation, If there is any suspicious activity, I know this is fixed by the Google Recaptcha API. It is giving tokens all the time (which I am validating on all side curl calls)
Issue: After submitting the form, the Recaptcha window appears and after Recaptcha verification, the page is not submitting automatically.
Que updated with gaetanom. 's solution
My Script:
<script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"
async defer></script>
<script type="text/javascript">
var onloadCallback = function() {
grecaptcha.render('g-recaptcha', {
'sitekey' : '6Lf7X68ZAAAAAMAyjWey_BRNhGvwi4jHBLIdzYjM',
'callback' : setResponse
});
};
function setResponse(response) {
alert(response);
document.getElementById('captcha-response').value = response;
}
jQuery(myForm).on('submit', function (e) {
e.preventDefault(); // avoid to submit
if (validation() == true) {
grecaptcha.execute();
}else {
this.submit();
}
});
</script>
<div id="g-recaptcha" class="g-recaptcha" data-size="invisible"></div>
<input type="hidden" id="captcha-response" name="captcha-response" />
Your issue is in this line:
In order to avoid to submit the form you can change the previous line to:
Another way is to change the input from type=submit to input type=button.