Invisible ReCaptcha with jQuery ajax

Question

I am trying to implement the newest ReCaptcha (aka \"invisible\" ReCaptcha) within an form using jQuery and an \"ajax\" request.
ReCaptcha documentation: https://devel

Answer 1

So here is how I solved it after digging further in Invisible reCAPTCHA's doc, and learning a bit of jQuery obviously since I was not very familiar with JS (cool stuff):

My head tag with the javascript (and a bit of css to remove the ugly Google badge):

HTML:

    

    

    

    

    Connexion

Let me know if you need the whole PHP as well since it's out of the scope of this question. You will probably need to change "url: location.href," within the JS above since in my case the script rendering the HTML form and the JS and dealing with the POST vars is the same (not great, testing purpose). Basically I just verify the POST vars then finally return a json like:

$jsonVictoire = true; // boolean
$jsonMessage = 'anything you want to tell your visitor'; // string

$return = 
    json_encode(
        array(
            'Victoire'=>$jsonVictoire,
            'Message'=>$jsonMessage
        )
    );
die($return);