CODEWITHSUNDEEP
jqueryrecaptcha
user6123192
user6123192

Reputation:

Google reCaptcha not validating on client side

server side ok, work properly, but client side validating not working like below code:

<script src='https://www.google.com/recaptcha/api.js'></script>
  <div class="g-recaptcha" data-sitekey="xxxxx"></div>
  <div id="html_element"></div>

JS

 <script>
        var googleResponse = jQuery('#g-recaptcha-response').val();
        if (!googleResponse) {
            $('<p style="color:red !important" class=error-captcha"><span class="glyphicon glyphicon-remove " ></span> Please fill up the captcha.</p>" ').insertAfter("#html_element");
            return false;
        } else {

            return true;
        }
    </script>

Where is my problem?

Upvotes: 2

Views: 2865

Answers (1)

user5835902
user5835902

Reputation:

You should follow below code:

 <div id="html_element" style="display: none;color:red !important">
    <span class="glyphicon glyphicon-remove " ></span>
        Please fill up the captcha.
</div>

$('#form').on('submit', function (e) {
  var response = grecaptcha.getResponse();
    //recaptcha failed validation
           if(response.length == 0) {
               e.preventDefault();
               $('#html_element').show();
            }
            //recaptcha passed validation
            else {
               $('#html_element').hide();
            }
            if (e.isDefaultPrevented()) {
              return false;
            } else {
              return true;
            }
        });

Upvotes: 1

Related Questions