Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
Google Captcha V2 page setup
<!DOCTYPE html>
<html>
<head>
<title>Google Captcha v2</title>
<script type="text/javascript" language="JavaScript">
// Callback to get the button working.
function enableBtn1(){
document.getElementById("button1").disabled = false;
}
function enableBtn2(){
document.getElementById("button2").disabled = false;
}
// Call to rendor the captcha
var recaptcha1;
var recaptcha2;
var myCallBack = function() {
//Render the recaptcha1 on the element with ID "recaptcha1"
recaptcha1 = grecaptcha.render('recaptcha1', {
//'sitekey' : '6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI', //test key
'sitekey' : 'YOUR_SITE_KEY', // production
'theme' : 'light', // can also be dark
'callback' : 'enableBtn1' // function to call when successful verification for button 1
});
//Render the recaptcha2 on the element with ID "recaptcha2"
recaptcha2 = grecaptcha.render('recaptcha2', {
//'sitekey' : '6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI', // test key
'sitekey' : 'YOUR_SITE_KEY', // production
'theme' : 'light', // can also be dark
'callback' : 'enableBtn2' // function to call when successful verification for button 2
});
};
</script>
</head>
<body>
<div class="form-wrap">
<!-- Form 1 -->
<form id="form-1">
<!--
Other form elements...
-->
<div id="recaptcha1" class="googlecapt"></div>
<div class="infusion-submit"><input type="submit" value="Submit" id="button1" /></div>
</form>
<!-- Form 2 -->
<form id="form-2">
<!--
Other form elements...
-->
<div id="recaptcha2" class="googlecapt"></div>
<div class="infusion-submit"><input type="submit" value="Submit" id="button2" /></div>
</form>
</div>
<script type="text/javascript">
jQuery(document).ready(function ($) {
// disable the button until successfull google captcha
document.getElementById("button1").disabled = true;
document.getElementById("button2").disabled = true;
})(jQuery);
</script>
<!-- include recaptcha from google -->
<script src="https://www.google.com/recaptcha/api.js?onload=myCallBack&render=explicit" async defer></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment