How to validate form before recaptcha runs

Highlighted

How to validate form before recaptcha runs

I am trying to implement recaptcha in one of our forms and I am using the script below. I am running into an issue where if the user does not fill out the form completely the validation kicks in but it will not let them submit the form even after correcting the info on the form. What I think is happening is the recaptcha is firing off to google server before the form is validated. How can I make sure the form is validated before it runs the recaptcha?

    

 

<script type="text/javascript">
MktoForms2.whenReady(function (form) {
jQuery( "button[type='submit']" ).addClass( "g-recaptcha" ).attr( "data-sitekey", "mykey" ).attr("data-callback","letsGo");
jQuery.getScript( "https://www.google.com/recaptcha/api.js");
 letsGo = function() {  
    MktoForms2.whenReady(function (form) {  
      var v = grecaptcha.getResponse();  
      form.vals({"spamCheck" : v});  
      form.submit();  
    });   
    };   
});  
</script>  

 

 

5 REPLIES 5
Highlighted
Level 10 - Community Moderator

Re: How to validate form before recaptcha runs

Follow the recipe at MktoForms2 :: reCAPTCHA v3 v1.1.1

 

That's how you integrate asynchronous requests with the Forms 2.0 API.

Highlighted

Re: How to validate form before recaptcha runs

Are the webhooks the same set up as they are for previous set ups for recaptcha?

Highlighted
Level 10 - Community Moderator

Re: How to validate form before recaptcha runs

Nope, not the same, you need to account for a whole different response type.

Highlighted

Re: How to validate form before recaptcha runs

Do you have a link to a post outlining how to set up the web hooks maybe?

Highlighted
Level 10 - Community Moderator

Re: How to validate form before recaptcha runs

Working on one.