Google ReCaptcha

by Pankaj Sapkal

HTML

<script>
 var vcc = function(g_recaptcha_response) {
 var $captcha = $( '#recaptcha' );
 
 $( '.msg-error' ).text('');
    $captcha.removeClass( "error" );
 };
</script>
<script src="https://www.google.com/recaptcha/api.js"></script>

<form id="kontakt_form">  
  <div id="recaptcha" class="g-recaptcha" data-sitekey="6LcgSAMTAAAAACc2C7rc6HB9ZmEX4SyB0bbAJvTG"        data-callback="vcc"></div>

  <span class="msg-error"></span>
  <br/>
  <input id="sbt" type="submit" value="Submit">
</form>

CSS

.msg-error {
  color: red;
 }

JavaScript

$(document).ready(function(){
		$('#sbt').click(function(){
			$("#kontakt_form").submit(function(){
 			//[0] - numer wiersza w tablicy
    if($(this).serializeArray()[0].value != "")	
    				{
  				alert('Success');
          // form submit return true
 					return true;
 				}
 
 				else
				{
        // form submit return false
 					return false;
 				}
			});
    	$captcha = $( '#recaptcha' );
      response = grecaptcha.getResponse();

  if (response.length === 0) {
    $( '.msg-error').text( "Check the box to confirm that you are a human" );
    if( !$captcha.hasClass( "error" ) ){
      $captcha.addClass( "error" );
    }
  } else {
    $( '.msg-error' ).text('');
    $captcha.removeClass( "error" );
    // form submit return true
   	 return true;
  }
	});
 });