Why is Recaptcha not appearing?

user_436560 0
Viewed 2172

I have been using Recaptcha at multiple sites. Using an existing install of Recaptcha v2, I have added a new host to the domains list. Subsequently, I have made sure that the library is used

<script src='https://www.google.com/recaptcha/api.js'></script>

also, I have included the necessary tag of reCaptcha2 to my structure template of a registration form

public static function Registration($params) {
    $response = $params["Response"];
    $response->set("template",
            '<label for="username">Felhasználónév</label>'.
            '<input class="form-data" name="Username" type="text" id="username">'.
            '<label for="password">Jelszó</label>'.
            '<input class="form-data" name="Password" type="password" id="password">'.
            '<label for="confirm-password">Jelszó ismétlése</label>'.
            '<input class="form-data" name="ConfirmP" type="password" id="confirm-password">'.
            '<label for="name">Név</label>'.
            '<input class="form-data" name="Name" type="text" id="name">'.
            '<label for="email">Email</label>'.
            '<input class="form-data" name="Email" type="text" id="email">'.
            '<label for="bio">Bio</label>'.
            '<textarea class="form-data" name="Bio" id="bio"></textarea>'.
            '<form><div class="g-recaptcha" id="recaptcha" data-sitekey="<my key>"></div></form>'.
            '<span class="api form" data-form-name="Registration" data-events="click" data-container="#popup-content">Beküldés</span>'
            );
    return $response;
}

Even though, using the same key in older instances worked, this, by itself is not enough for my reCaptcha to show up. Is reCaptcha taking some time before it is getting active? Or are there some dependencies to be included, like jquery? Basically, what should I do for my reCaptcha to appear on my registration panel? (everything else appears successfully)

recaptcha css html php
1 Answers

The problem was that I have added my recaptcha dynamically in a popup window after the page was loaded. The solution was to put this chunk into the callback:

                        var recaptcha = radWindow.querySelector("#recaptcha");
                        if (recaptcha) {
                            grecaptcha.render("recaptcha");
                        }

where radWindow is the popup window object and recaptcha is the id of the recaptcha tag.

user_4365600
Related