如何通过验证创建Google验证码

Question

I want to add google Captcha with validation my all fields are working properly but when i add google captcha than it's not working i am sharing my code below. Thanks in advance.. Also check following link Click Here Form live link

 $('#test').bootstrapValidator({ feedbackIcons: { valid: 'glyphicon glyphicon-ok', invalid: 'glyphicon glyphicon-remove', validating: 'glyphicon glyphicon-refresh' }, fields: { firstName: { validators: { notEmpty: { message: '<span class="error-msg">A name is required.</span>' } } }, email: { validators: { notEmpty: { message: '<span class="error-msg">An email address is required.</span>' }, emailAddress: { message: '<span class="error-msg">Email address is not valid.</span>' } } }, phone: { validators: { notEmpty: { message: '<span class="error-msg">A phone number is required.</span>' } } }, state: { validators: { notEmpty: { message: '<span class="error-msg">A state is required.</span>' } } }, value: { validators: { notEmpty: { message: '<span class="error-msg">A property value is required.</span>' } } }, loan_amount: { validators: { notEmpty: { message: '<span class="error-msg">A loan amount is required.</span>' } } }, loanpurpose: { validators: { notEmpty: { message: '<span class="error-msg">A loan purpose is required.</span>' } } } } }); $('#test').on('status.field.bv', function(e, data) { formIsValid = true; $('.form-group',$(this)).each( function() { formIsValid = formIsValid && $(this).hasClass('has-success'); }); if(formIsValid) { $('.submit-button', $(this)).attr('disabled', false); } else { $('.submit-button', $(this)).attr('disabled', true); } }); 

 input[type="submit"]:disabled { background-color: red; } .error-msg{ color:#fff;} 

 <script src="http://skyliteweb.in/form/jquery.min.js"></script> <script src="http://skyliteweb.in/form/0a3b9034e109d88d72f83c9e6c9d13b7.js"></script> <script type="text/javascript" src="https://www.google.com/recaptcha/api.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" > <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" > <form id="test" action="test.php"> <div class="form-group"> <input type="text" class="form-control" name="firstName" placeholder="First name" /> </div> <div class="form-group"> <input class="form-control" name="email" type="text" size="35" placeholder="Email*"></input> </div> <div class="form-group"> <input class="form-control" type="text" id="phone" name="phone" placeholder="Phone Number:" /> </div> <div class="form-group"> <select class="select form-control" id="state" name="state"> <option value="">Select State</option> <option value="Arizona">Arizona</option> <option value="California">California</option> <option value="Colorado">Colorado</option> <option value="Florida">Florida</option> <option value="Georgia">Georgia</option> <option value="Idaho">Idaho</option> <option value="Louisiana">Louisiana</option> <option value="Maryland">Maryland</option> <option value="Massachusetts">Massachusetts</option> <option value="Nebraska">Nebraska</option> <option value="New Mexico">New Mexico</option> <option value="North Carolina">North Carolina</option> <option value="Oregon">Oregon</option> <option value="Pennsylvania">Pennsylvania</option> <option value="South Carolina">South Carolina</option> <option value="Texas">Texas</option> <option value="Utah">Utah</option> <option value="Virginia">Virginia</option> <option value="Washington">Washington</option> <option value="Wyoming">Wyoming</option> </select> </div> <div class="form-group"> <input class="form-control" id="value" type="text" name="value" placeholder="Value" /> </div> <div class="form-group"> <input class="form-control" id="loan_amount" type="text" name="loan_amount" placeholder="loan Amount" /> </div> <div class="form-group"> <select class="select form-control" id="loanprogram" name="loanpurpose" > <option value="">Loan Purpose</option> <option value="Purchase">Purchase</option> <option value="Refinance Current Loan">Refinance Current Loan</option> <option value="Refinance &amp; Cash-Out">Refinance &amp; Cash-Out</option> </select> </div> <div class="g-recaptcha" data-sitekey="6Le-AR0TAAAAAPJ_jRb62dQlMWSoLl0a1P73NxJW"></div> <input class="btn btn-lg btn-success submit-button" style="width: 100%;" value="Sign Up!" type="submit" disabled></input> </form> 

Answer 1

You can use "getResponse()" predefined function for validation.

function control(){
   var msg = '';
   if($('#name').val() == '') msg += 'Invalid Name';
   if($('#email').val() == '') msg += 'Invalid Email';
   if($('#phone').val() == '') msg += 'Invalid Phone';

   if(!grecaptcha.getResponse()) msg += 'Please confirm you are not a robot';
   if(msg){
      alert(msg);
      return false;
   }
}