user4810133
user4810133

Reputation:

reCaptcha not working on firefox

I've problems with reCaptcha, it's implemented as following ...

<head>
    <script>
    var widget_register;
    var onloadCallback = function () {
        widget_register = grecaptcha.render('form_recaptcha', {
            'sitekey': 'my-own-sitekey'
        });
    };
    </script>
</head>


<script>
    function setCaptcha(captcha) {
        app.captcha_response = captcha;
    }
</script>

<form id="recaptcha" class="design_recaptcha" action="javascript:setCaptcha(grecaptcha.getResponse(widget_register));">
    <div id="form_recaptcha"></div>
    <input type="submit" hidden/>
</form>

<script src="https://www.google.com/recaptcha/api.js onload=onloadCallback&render=explicit" async defer>
</script>

<paper-button id="register">Register</paper-button>

When the button with the "register" id is clicked, in my javascript the following code is executed.

$('#recaptcha').submit();

Then the function setCaptcha is executed, which gets the reCaptcha response-code as following. You find this code above in the form action tag.

action="javascript:setCaptcha(grecaptcha.getResponse(widget_register));"

The captcha response is then saved to a variable in my app.js.

This setup works in chrome, opera and egde browser. Only browser which it doesn't work is firefox.

Somebody has the same problem? or a solution for me? thx :)

Upvotes: 0

Views: 2858

Answers (1)

Shaun
Shaun

Reputation: 927

Use an onsubmit attribute rather than in the action tag which is really meant for the post url:

onsubmit="setCaptcha(grecaptcha.getResponse(widget_register)); return false"

If you want the form to actually submit, which I don't think you do in this case, return true instead of false.

Upvotes: 1

Related Questions