Google reCAPTCHA reset multiple captchas rendered by function call

Energizem

I have many reCAPTCHA's who are rendered dynamically, sometimes there are 2 sometimes 50 depends on page. I've done rendering with this:

<script src="https://www.google.com/recaptcha/api.js?onload=CaptchaCallback&render=explicit" async defer></script>
var CaptchaCallback = function(){
    $('.g-recaptcha').each(function(index, el) {
        grecaptcha.render(el, {'sitekey' : 'myKey'});
    });
};

And placed this where I want captcha to be displayed:

<div class="g-recaptcha" data-sitekey="myKey"></div>

I've got ajax call, that submits form data to process.php, and if form data isn't verified returns custom errors

$.ajax({
    type        : 'POST', 
    url         : 'process.php', 
    data        : $(this).serialize(), 
    dataType    : 'json'
})
    .done(function(data) { 
        if ( ! data.success) {    ...

It works as intended, but now I want to show message to user as part of validation, if he forgot to solve captcha.

With

var response = grecaptcha.getResponse();
if(response.length == 0){
    $('.result').append('Captcha incorrect, please click I am not robot');
}

and to reset captcha add this bellow

if ( ! data.success) {
      grecaptcha.reset();

What does it do is: reset captcha if user didn't completed all forms valid.

This all works only on 1st occurrence of reCAPTCHA. And I need it to somehow tell it to reset only captcha that is currently in use.

My best guess was to try with

var form = $(this); //get current form
 grecaptcha.reset(form);

It won't work, since i need widget ID, and not form. Can you assist me pls?

Energizem

All credits to https://stackoverflow.com/a/41860070/7327467

reset is done with

var form = $(this); //store current form

var response = grecaptcha.getResponse(jQuery(form).find('#data-widget-id').attr('data-widget-id'));
if(response.length == 0){ //append error to result div
     form.find('.result').append('<div class="alert alert-danger">' + "Captcha incorrect" + '</div>');    }

and to reset recaptcha, I've added this instead previous "grecaptcha.reset();"

grecaptcha.reset(jQuery(form).find('#data-widget-id').attr('data-widget-id'));

Hope this helps.

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

How to reset Google recaptcha with react-google-recaptcha

From Javascript

Google reCaptcha reset doesn't work

From Dev

Google ReCAPTCHA callback function not working

From Dev

Does Recaptcha v3 show graphical captchas at all?

From Dev

How to detect captchas when scraping google?

From Dev

Meteor: Call function after template is rendered with data

From Dev

Google recaptcha with my jquery/ajax function

From Dev

javascript Multiple or Reset countdown function

From Dev

Can you automate download of the audio file of Google Captchas?

From

'static' value appears to reset after function call

From Dev

Why does the pointer not reset, in a recursive function call

From Dev

Multiple kwargs in a function call?

From Dev

If statement in multiple function call

From Dev

How to call a JS function or Python method when a glyph is completely rendered?

From Javascript

How to call a JavaScript function on a web page rendered by Electron?

From Dev

Template is being rendered as plain text when I try to call a function

From Dev

Call a js function on an html snippet rendered using ngBindHtml

From Dev

call a function in google console

From Dev

How can fix this AWS Lambda Function for Google reCaptcha?

From Dev

How to reset recaptcha on Success for signInWithPhoneNumber()

From Dev

Handle multiple input boxes rendered using map function javascript

From Dev

A context consumer was rendered with multiple children, or a child that isn't a function

From Java

Python Google Cloud Function Connection reset by peer

From Dev

Looping a reset function in Google Apps Script

From Dev

my function variable reset when I call function javascript

From Dev

Firebase reCAPTCHA has already been rendered in this element

From Dev

Invisible reCaptcha AJAX Call

From Dev

Function call to memoization (with multiple parameters)

From Dev

checkbox function call with multiple parameters

Related Related

  1. 1

    How to reset Google recaptcha with react-google-recaptcha

  2. 2

    Google reCaptcha reset doesn't work

  3. 3

    Google ReCAPTCHA callback function not working

  4. 4

    Does Recaptcha v3 show graphical captchas at all?

  5. 5

    How to detect captchas when scraping google?

  6. 6

    Meteor: Call function after template is rendered with data

  7. 7

    Google recaptcha with my jquery/ajax function

  8. 8

    javascript Multiple or Reset countdown function

  9. 9

    Can you automate download of the audio file of Google Captchas?

  10. 10

    'static' value appears to reset after function call

  11. 11

    Why does the pointer not reset, in a recursive function call

  12. 12

    Multiple kwargs in a function call?

  13. 13

    If statement in multiple function call

  14. 14

    How to call a JS function or Python method when a glyph is completely rendered?

  15. 15

    How to call a JavaScript function on a web page rendered by Electron?

  16. 16

    Template is being rendered as plain text when I try to call a function

  17. 17

    Call a js function on an html snippet rendered using ngBindHtml

  18. 18

    call a function in google console

  19. 19

    How can fix this AWS Lambda Function for Google reCaptcha?

  20. 20

    How to reset recaptcha on Success for signInWithPhoneNumber()

  21. 21

    Handle multiple input boxes rendered using map function javascript

  22. 22

    A context consumer was rendered with multiple children, or a child that isn't a function

  23. 23

    Python Google Cloud Function Connection reset by peer

  24. 24

    Looping a reset function in Google Apps Script

  25. 25

    my function variable reset when I call function javascript

  26. 26

    Firebase reCAPTCHA has already been rendered in this element

  27. 27

    Invisible reCaptcha AJAX Call

  28. 28

    Function call to memoization (with multiple parameters)

  29. 29

    checkbox function call with multiple parameters

HotTag

Archive