javascript - ReCaptcha 2.0: enable Submit button on callback if recaptcha successful

Question

I have a very simple form as follows. I want to make it so that the Submit button is disabled, and only enabled after the user has successfully completed the ReCaptcha.

I'm assuming I'm going to need some Javascript / jQuery to do this.

Google's documentation on ReCaptcha 2.0 seems really sparse and dense (to me, anyway). I'd appreciate some pointers:

<form action="something.php" method="post">
    Name: <input type="text" size="40" name="name"><br><br>
    <div class="g-recaptcha" data-sitekey="############-#####"></div>
    <input type="submit" value="Submit" >
</form>

Answer 1

i did the same thing on my test site. however, i used a button instead of submit, so here:

you must add the property data-callback="enableBtn" data-callback property executes the function specified after accomplishment of recaptcha.

<div class="g-recaptcha" data-sitekey="############-#####" data-callback="enableBtn"></div>

and set the id of the button to whatever id you want to and set it to disabled:

<input type="button" value="Submit" id="button1" disabled="disabled">

then on javascript make a function to enable the button

 function enableBtn(){
   document.getElementById("button1").disabled = false;
 }

hope it helps.