title: reCAPTCHA PHP and AJAX
body: <p>I am trying to add a reCAPTCHA to my PHP contact form with AJAX. I want the user to be displayed with the reCAPTCHA and have the user enter it. If it is incorrect it should display so without leaving the page. Only if the CAPTCHA is correct should it go to <code>contacts-go.php</code> and run the code to send the e-mail. I tried to do it from <a href="http://www.darksideofthecarton.com/2008/12/15/validating-recaptcha-jquery-ajax/" rel="nofollow">this</a> example.</p>
  
  <p>This is what I have on my <strong>contact.php</strong> page:</p>
  
  <pre><code>&lt;?php   
      session_start();
  ?&gt;
  
  &lt;html&gt;
      &lt;head&gt;
          &lt;script type="text/javascript" src="/js/jquery-1.4.2.min.js"&gt;&lt;/script&gt;
          &lt;SCRIPT type="text/javascript"&gt;
              function validateCaptcha()
              {
                  challengeField = $("input#recaptcha_challenge_field").val();
                  responseField = $("input#recaptcha_response_field").val();
                  //alert(challengeField);
                  //alert(responseField);
                  //return false;
                  var html = $.ajax({
                  type: "POST",
                  url: "ajax.recaptcha.php",
                  data: "recaptcha_challenge_field=" + challengeField + "&amp;amp;recaptcha_response_field=" + responseField,
                  async: false
                  }).responseText;
  
                  if(html == "success")
                  {
                      $("#captchaStatus").html(" ");
                      // Uncomment the following line in your application
                      return true;
                  }
                  else
                  {
                      $("#captchaStatus").html("Your captcha is incorrect. Please try again");
                      Recaptcha.reload();
                      return false;
                  }
              }
  
          &lt;/SCRIPT&gt;
  
          &lt;script type="text/javascript"&gt;
  
  &lt;/script&gt;
  
      &lt;/head&gt;
  
  
  &lt;body&gt;
      &lt;?php
          require_once("ajax.recaptcha.php");
      ?&gt;
  
      &lt;div id="login"&gt;
          &lt;form method="post" onSubmit="return validateCaptcha()" action="contacts-go.php"&gt;
  
                  &lt;label&gt;Message&lt;/label&gt;
                  &lt;br /&gt;
                  &lt;textarea type="text" id="name" name="message" size="20"&gt;&lt;/textarea&gt;
  
              &lt;p&gt;&lt;?php echo recaptcha_get_html($publickey);?&gt;&lt;/p&gt;
  
              &lt;p style="color: red;" id="captchaStatus"&gt;&amp;nbsp;&lt;/p&gt;
  
              &lt;input type=submit name="submit" value="Submit"&gt;
          &lt;/form&gt;
      &lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>This is the <strong>ajax.recaptcha.php</strong> file</p>
  
  <pre><code>&lt;?php
  
      //A. Load the Recaptcha Libary
      require_once("recaptchalib.php");
      require_once("recaptha-keys.php");  // my reCAPTCHA Keys
  
      $resp = recaptcha_check_answer ($privatekey,
                                  $_SERVER["REMOTE_ADDR"],
                                  $_POST["recaptcha_challenge_field"],
                                  $_POST["recaptcha_response_field"]);
  
      if ($resp-&gt;is_valid) {
          ?&gt;success&lt;?
          $_SESSION['captcha'] = 1;
      }
      else 
      {
          die ("The reCAPTCHA wasn't entered correctly. Go back and try it again." .
             "(reCAPTCHA said: " . $resp-&gt;error . ")");
      }
  ?&gt;
  </code></pre>
  
  <p>All I am getting is a blank page with the following:</p>
  
  <p><code>The reCAPTCHA wasn't entered correctly. Go back and try it again.(reCAPTCHA said: incorrect-captcha-sol)</code></p>