CODEWITHSUNDEEP
captcharecaptcha
luigi7up
luigi7up

Reputation: 5962

Re-captcha's widget buttons reload the whole page

I have Google's re-captcha implemented and working in Chrome perfectly (AJAX APIs). IE is the problem...

I have: localhost://myapp/index.html and a link for Forgot your password. When this link is clicked jQuery click handler is called. Handler function changes the div's content and also calls for Recaptcha.create(...) The widget is displayed correctly and works as expected in Chrome, but in IE if I click on reload icon or the sound button it reloads the whole page.

If I manually call for Recaptcha.reload() it reloads without any problem ?!

HTML I have is:

<div id="recaptcha" style="width:120px"></div>

[...]

<script type="text/javascript" src="https://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>

[...]

//In a jquery click handler I call
Recaptcha.create("6LxxxxxxxxxxxxxxxxxxxxxxIrpV5RO8P",
                    "recaptcha",
                    {
                        theme:'white',
                        callback: Recaptcha.focus_response_field
                    }
            );

So far so good... Captcha gets loaded well in all browsers. In IE8 and 9 when I click the widgets buttons for reload and mp3 version the whole page gets reloaded

I tried changing http for https and vice-versa, but still without any luck...

Upvotes: 2

Views: 1180

Answers (1)

luigi7up
luigi7up

Reputation: 5962

When Recaptcha.create(); is called, Google's re-captcha RELOAD and IMAGE/TEXT buttons' code looks something like this:

 <a href="javascript:Recaptcha.reload();">

and I don't know why the page gets reloaded in my app in IE when the button is pressed and in the demo Google provided DEMO it sends a async request...

Since I can't change the javascript in href attribute I had to add a onclick handler in jQuery $(document).ready();

My solution was this:

$("#recaptcha).on("click", "id_of_the_reload_button", function(e){
    e.preventDEfault();
    Recaptcha.reload();
});

I basically blocked the natural behavior of the anchor google provides and called the reload() function myself. I've never found out what was causing my page to reload in the first place

Upvotes: 2

Related Questions