Google reCAPTCHA fail for second time submit
Those who have the same problem and meet this topic during research; If you experience problem when you render the captcha automatically, try to render it explicitly. In order to do this, add following code inside body tag.
<script src="https://www.google.com/recaptcha/api.js?onload=recaptchaCallback&render=explicit&hl=tr" async defer></script>
-
var recaptchaCallback = function () { // alert("grecaptcha is ready!"); grecaptcha.render("YOUR HTML DIV ID", { 'sitekey': 'YOUR SITE KEY', }); };
I'm using AJAX to check registration form and get response. So I have added reset function to my AJAX response.
$('#frmRegistration').submit(function () { $.ajax({ url: "_ajax/_ajaxRegistration.php", type: "POST", data: $('#frmRegistration').serialize(), success: function (reply) { $('#resultRegistration').html(reply); grecaptcha.reset(); } }); });
Reference Google reCaptcha explicit render.
Google reCAPTCHA gives these two functions: I always use this in all my AJAX powered forms.
grecaptcha.getResponse()
grecaptcha.reset();
For both of your problems, use the second function whenever you need in your JavaScript code.
Remember this works if you have only one CAPTCHA in your page. If you have more than two CAPTCHAs use their IDs as explained in Google Docs
https://developers.google.com/recaptcha/docs/display#js_api