How I can add reCaptcha in this form? - php

Question

I want to add Google reCaptcha in this form I tried all things but all in vain.. What I need to do to make form successfully submitted.. and also make reCaptcha a required field using Ajax form submission...
HTML:-
<form id="contact-form" class="uk-form">
<fieldset>
<label>Name <em>*</em></label>
<input type="text" name="name" class="textfield" id="name" value="" />
<label>E-mail <em>*</em></label>
<input type="email" name="email" class="textfield" id="email" value="" />
<label>Services <em>*</em></label>
<input type="text" name="subject" class="textfield" id="subject" value="" />
<label>Message <em>*</em></label>
<textarea name="message" id="message" class="textarea" cols="2" rows="6"></textarea>
<div class="clearfix">
<div class="g-recaptcha" data-sitekey="My_Site_Key"></div>
</div>
<label> </label>
<button type="submit" name="submit" class="uk-button uk-button-small idz-button-blue" id="buttonsend">Submit</button>
<span class="loading" style="display: none;">Please wait..</span>
</fieldset>
</form>
JS:-
$('#buttonsend').click( function() {
var name = $('#name').val();
var subject = $('#subject').val();
var email = $('#email').val();
var message = $('#message').val();
$('.loading').fadeIn('fast');
if (name != "" && subject != "" && email != "" && message != "")
{
$.ajax(
{
url: './contact-us.php',
type: 'POST',
data: "name=" + name + "&subject=" + subject + "&email=" + email + "&message=" + message,
success: function(result)
{
$('.loading').fadeOut('fast');
if(result == "email_error") {
$('#email').css({"background":"#FFFCFC","border":"1px solid #ffadad"}).next('.require').text(' !');
} else {
$('#name, #subject, #email, #message').val("","Name","Subject","Email","Message");
$('<div class="uk-alert uk-alert-success uk-text-center uk-margin-medium-bottom" data-uk-alert><p>Your message has been sent successfully. Thank you!</p></div>').insertBefore('#contact-form');
$('.uk-alert').fadeOut(5000, function(){ $(this).remove(); });
}
}
}
);
return false;
}
else
{
$('.loading').fadeOut('fast');
if( name == "","Name") $('#name').css({"background":"#FFFCFC","border":"1px solid #ffadad"});
if(subject == "","Subject") $('#subject').css({"background":"#FFFCFC","border":"1px solid #ffadad"});
if(email == "","Email" ) $('#email').css({"background":"#FFFCFC","border":"1px solid #ffadad"});
if(message == "","Message") $('#message').css({"background":"#FFFCFC","border":"1px solid #ffadad"});
return false;
}
});
$('#name, #subject, #email,#message').focus(function(){
$(this).css({"border":"none","background":"#fafafa","border":"1px solid #ccc"});
});
PHP:-
$to = "xyz#mydomain.com";
$subject = "Contact Inquiry";
$name = $_POST['name'];
$email = $_POST['email'];
$services = $_POST['subject'];
$message = $_POST['message'];
$str = "Name: ".$name."\r\n\r\n"."Services: ".$services."\r\n\r\n"."Message: ".$message."\r\n\r\n".
$headers = "From: $email";
$sent = mail($to, $subject, $str, $headers) ;