ReCaptcha: how to auto-update a form when submitting a captcha

I want to use ReCaptcha to load some additional data on the page. I want the form to be submitted automatically when the ReCaptcha is entered. So I don't need an additional submit button. The problem is recaptcha is loading its content inside the iframe, so its a bit tricky.

At the moment I have this form:

<form action="javascript:getInfo(grecaptcha.getResponse(widget1));" >
      <div id="captcha"></div>
      <br>
      <input type="submit" value="Submit">
</form>

      

How do I get something like Event-Listener in recaptcha submit that submits an external form?

+3


source to share


2 answers


This sounds like an interesting technique. This will cut down on keystrokes and keystrokes for the user. This is how you could do it, after listening to a successful response with a caption, you will be able to follow the desired action. Here's an example and some documentation. https://developers.google.com/recaptcha/docs/display#example



var RC2KEY = 'sitekey';

function reCaptchaVerify(response) {
  if (response === document.querySelector('.g-recaptcha-response').value) {
    document.forms['form-name'].submit();
  }
}

function reCaptchaExpired() {
  /* do something when it expires */
}

function reCaptchaCallback() {
  grecaptcha.render('id', {
    'sitekey': RC2KEY,
    'callback': reCaptchaVerify,
    'expired-callback': reCaptchaExpired
  });
}
      

<script src='https://www.google.com/recaptcha/api.js?onload=reCaptchaCallback&render=explicit'></script>
      

Run codeHide result


+5


source


Use #

instead?



?

is used to start query lines and will react randomly to type responses method=GET

. #

is an anchor character and will work.

+2


source







All Articles