data-callback function not working in Invisible reCAPTCHA.

[Arjun M K]

I have implemented Invisible reCAPTCHA in a site for a register form.When I click the the submit button the reCAPTCHA will appear and after the verification it doesn't call the callback function.

This is the script.
{literal}

  <script src="https://www.google.com/recaptcha/api.js" async defer></script>

    

 <script>

     function onSuccess = function(token) {

     document.getElementById("registerform").submit();

    }

     </script>

       {/literal}

 <form action="" method="post" name="registerform" id="registerform"  onsubmit="javascript: return checkRegFormFields(this);">
.

.

.
.
.

  <td colspan="2" class="button-row">

                <button class="btn main-button btn-danger no-bdrs btn-block btn-lg g-recaptcha" data-sitekey="mysitekey" data-callback="onSuccess"  title="Submit">  Submit </button>

  </td>

[sman...@brevardmusic.org]

If you're experiencing the same issue as I am your data-callback function is getting called correctly, but the form submission is failing.  (If you replace that form submission line with an alert, you should successfully see the alert.)  Something happens when the recaptcha function is called that blocks the form from being submitted afterward.  I have no idea how you're supposed to submit the form after successfully passing the recaptcha, which is what led me to your post.  Hopefully someone comes along who knows how to get past this issue.

I am using the exact code from Google's developer page in the "Invoking the invisible reCAPTCHA challenge after client side validation." section.  The validation works, but the form never gets submitted.

[sman...@brevardmusic.org]

Turns out my code was failing because the id of the button was set as "submit" which made the submit call fail.  Changing the id of the button to anything else fixed the issue.  Not sure if this will help you or not.

On Tuesday, January 17, 2017 at 5:43:20 AM UTC-5, Arjun M K wrote:

[j...@cloudaccess.net]

I had a same problem, form submit is disabled somehow.

Any update on this #Google.

[Eduardo Kortright]

Same problem here.  The callback function is being called, but the form will not submit.  It will submit with no problems if you use the visible reCaptcha.

[Eduardo Kortright]

I finally figured out the problem with my implementation.  Hopefully this will help others having similar problems.

First, my form has an <input type="submit"> tag for the submit button.  The form had an explicit name attribute for the input (name="submit").  This was conflicting with the submit() method on the form.  I tried removing the name attribute completely, but I think the type="submit" must be making the name default to "submit" as before.  So I just gave the tag an explicit name attribute with a name other than "submit".  After that, the form submission started working.

Second, the callback specified on the submit button will run after the reCAPTCHA is successfully solved, so if you depend on the callback to do any validation, you must call 

grecaptcha.reset()

if the validation fails.  That will make the user solve the reCAPTCHA again, but otherwise the user would never be able to submit the form after making corrections.

[andres....@bairesdev.com]

I am also using the exact code published here and it's not working. Clicking on Submit does nothing.
https://developers.google.com/recaptcha/docs/invisible

The button is a standard button (no input submit) and has no id. What am I missing?

sman...@brevardmusic.org wrote :

[andres....@bairesdev.com]

Well, I managed to solve it. The problem was that you have to enable Invisible Captcha in Google's captcha admin page, and both keys are different. I've been trying in vain to use the standard keys. Later I also noticed that there's a message in the corner warning me that invisible captcha was not enabled on that site.

[Miles M]

Yes, this is definitely the correct solution, you can't use you v2 site key, you have to register a new one if your going to use the "invisible" version.  Thank you, Andres.