I'm having a devil of a time trying to get Ajax to automatically refresh on a JQuery AJAX callback. I have a ment box with the messages being refreshed posted immediately upon validation of reCaptcha and it would be nice if the reCaptcha could refresh automatically in case someone wants to add another ment immediately afterward. Here's my return function:
$.post(url, formData, function(data) {
if (returnString.match(/^Error:/)) {
$("#interactionResults").html(data).show().fadeOut(6000);
}
else if (postNumber == 0) {
$('#newCommentDisplay').html(returnString).show();
$.post("", "Recaptcha:reload()");
}
When I use:
$.post("", "Recaptcha:reload()");
I get an error:
XMLHttpRequest cannot load . Origin http://localhost:8888 is not allowed by Access-Control-Allow-Origin.
Fair enough, so I try to change that line with this one:
$('#recaptcha_reload_btn').trigger('click');
and still nothing is happening. Does anyone know what's going on?
I'm having a devil of a time trying to get Ajax to automatically refresh on a JQuery AJAX callback. I have a ment box with the messages being refreshed posted immediately upon validation of reCaptcha and it would be nice if the reCaptcha could refresh automatically in case someone wants to add another ment immediately afterward. Here's my return function:
$.post(url, formData, function(data) {
if (returnString.match(/^Error:/)) {
$("#interactionResults").html(data).show().fadeOut(6000);
}
else if (postNumber == 0) {
$('#newCommentDisplay').html(returnString).show();
$.post("http://www.google./recaptcha/api", "Recaptcha:reload()");
}
When I use:
$.post("http://www.google./recaptcha/api", "Recaptcha:reload()");
I get an error:
XMLHttpRequest cannot load http://www.google./recaptcha/api. Origin http://localhost:8888 is not allowed by Access-Control-Allow-Origin.
Fair enough, so I try to change that line with this one:
$('#recaptcha_reload_btn').trigger('click');
and still nothing is happening. Does anyone know what's going on?
Share Improve this question edited Dec 12, 2019 at 5:22 sideshowbarker♦ 88.2k29 gold badges215 silver badges211 bronze badges asked Apr 3, 2012 at 23:31 John BowlingerJohn Bowlinger 1,5794 gold badges12 silver badges14 bronze badges 5- ah, by "nothing is happening" do literally mean nothing, or do you still talk of a Google error? – marue Commented Apr 4, 2012 at 8:09
- Yeah, I literally mean nothing. Sorry I didn't make that clearer. – John Bowlinger Commented Apr 4, 2012 at 13:11
- Then you need to show your click-handler. Has to be some problem there. – marue Commented Apr 4, 2012 at 14:02
- @marue It's in an Iframe which is what I think may be tripping me up. I think I may need to send a JSON object back to Google. Here's the iframe: <iframe src="google./recaptcha/api/…" height="300" width="500" frameborder="0"></iframe><br/> – John Bowlinger Commented Apr 5, 2012 at 4:18
- Hm, it's not so easy to catch events from an iframe, i'm not even sure if it is possible. If you have outside that iframe, you could use the answer in this post stackoverflow./questions/4249809/… – marue Commented Apr 5, 2012 at 8:18
6 Answers
Reset to default 6in my html I have :
<div class="g-recaptcha" id='recaptcha' data-sitekey="xxxxxxxxxx"></div>
I use grecaptcha.reset();
example: if (typeof $('#recaptcha') != "undefined") { grecaptcha.reset(); }
Use
jQuery("#recaptcha_reload").click();
"#recaptcha_reload", the image itself, is the trigger. #recaptcha_reload_btn will NOT work, because the a-tag is NOT the trigger.
Recaptcha.reload();
( Recaptcha is already loaded )
if you are using new recaptcha 2.0 use this: for code behind:
ScriptManager.RegisterStartupScript(this, this.GetType(), "CaptchaReload", "$.getScript(\"https://www.google./recaptcha/api.js\", function () {});", true);
for simple javascript
<script>$.getScript(\"https://www.google./recaptcha/api.js\", function () {});</script>
You have not bound a click handler to your element. From the jQuery docs:
.trigger( eventType [, extraParameters] )
Description: Execute all handlers and behaviors attached to the matched elements for the given event type.
If you have not attached a handler to your element before calling trigger, there is no click handler to execute.
edit:
When you write $('#recaptcha_reload_btn').bind('click'); you actually set up a click handler, but one that does nothing. You have to tell that clickhandler what to do:
$('#recaptcha_reload_btn').bind('click',function() {
alert('you just clicked me');
};
If you do not set up a callback handler, the event is just registered but does not trigger any action. Combine this with the solution from this question Reload an iframe with jQuery and you should have your recaptcha doing what you want:
$('#recaptcha_reload_btn').bind('click',function() {
var iframe = document.getElementById('#recaptcha'); //use your own selector here!
iframe.src = iframe.src;
};
$( "#recaptcha_reload_btn" ).click();