How can I load a reCaptcha form using jQuery/AJAX while leaving the reCaptcha scripts in place?

jquery ajax cakephp recaptcha
eSentrik picture eSentrik · Aug 31, 2011 · Viewed 31k times · Source

I load my contact form into my page with JQuery/AJAX.

The contact form contains the reCaptcha scripts.

Unfortunately, JQuery removes the script tags before inserting them into my page. These script tags are needed because they output the captcha. now my loaded form has no captcha.

Answer

benck picture benck · Aug 31, 2011

The link has all you need: http://code.google.com/apis/recaptcha/docs/display.html

You can't add the script in ajax. You should add the following line before :

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

Then, you can dynamically create a recaptcha form in your js code by using adding the following code:

  Recaptcha.create("your_public_key",
    "element_id",
    {
      theme: "red",
      callback: Recaptcha.focus_response_field
    }
  );

Related questions

Push notification to the client browser

I'd like to create an application where when a Super user clicks a link the users should get a notification or rather a content like a pdf for them to access on the screen. Use Case: When a teacher wants …

Read More
jQuery AJAX submit form

I have a form with name orderproductForm and an undefined number of inputs. I want to do some kind of jQuery.get or ajax or anything like that that would call a page through Ajax, and send along all the …

Read More
How do I return the response from an asynchronous call?

I have a function foo which makes an asynchronous request. How can I return the response/result from foo? I tried returning the value from the callback, as well as assigning the result to a local variable inside the function …

Read More