Google Recaptcha implementation without plugin

Google Recaptcha Implementation

STEP 1:

Add Following Script on you page:

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

script>

<script src="http://code.jquery.com/jquery-latest.pack.js">script>

<script type="text/javascript">

function showRecaptcha(element) {

Recaptcha.create("your_public_key", element, { theme: "clean", callback: Recaptcha.focus_response_field });

}

function showResult() {

//alert('start');

var challengeVal = Recaptcha.get_challenge();

//alert(challengeVal);

var reponseVal = Recaptcha.get_response();

alert(reponseVal);

var remoteIp = "172.18.224.92";

//alert(remoteIp);

var privateKey = ’Your_Private_Key’;

var requestUrl = "http://api-verify.recaptcha.net/verify?privatekey=" + privateKey + "&remoteip=" + remoteIp + "&challenge=" + challengeVal + "&response=" + reponseVal;

return requestUrl;

}

script>

<script type="text/javascript">

$(document).ready(function () {

var container = $('#target');

$('.ajaxtrigger').click(function () {

var url = showResult();

doAjax(url);

//return false;

});

function doAjax(url) {

// if it is an external URI

if (url.match('^http')) {

// call YQL

$.getJSON("http://query.yahooapis.com/v1/public/yql?" +

"q=select%20*%20from%20html%20where%20url%3D%22" +

encodeURIComponent(url) +

"%22&format=xml'&callback=?",

// this function gets the data from the successful

// JSON-P call

function (data) {

// if there is data, filter it and render it out

if (data.results[0]) {

var data = filterData(data.results[0]);

container.html(data);

Recaptcha.reload();

// otherwise tell the world that something went wrong

} else {

var errormsg = '

Error: could not load the page.

';

container.html(errormsg);

}

}

);

// if it is not an external URI, use Ajax load()

} else {

$('#target').load(url);

}

}

// filter out some nasties

// filter out some nasties

function filterData(data) {

return data;

}

});

script>

After adding above script, add following line of code in section to display recaptcha

STEP 2:

<div id="recaptcha_div">

<script type="text/javascript">showRecaptcha('recaptcha_div');script>

div>

<input type="submit" name="Button1" value="Submit" class="ajaxtrigger">

<div id="target">div>