CODEWITHSUNDEEP
javascriptphpjqueryvalidationcaptcha
Praveen
Praveen

Reputation: 56501

validate captcha before submit

I've use captcha for form registration, within that I have validation engine for form inline validation. I'm stuck in validating the equity of captcha.

<p class="veriText">
    <label>Enter the Verification Text </label> <span style="color:red;">*</span>
    <input class="validate[required] text-input" type="text" name="captcha" id="captcha" class="text" value="" />                   
</p>
<img src="<?= get_bloginfo('template_url'); ?>/captcha_code_file.php?rand=<?php echo rand();?>" id='captchaimg'><br/>

PHP validation: (works perfectly) 

if(strcasecmp($_SESSION['code'], $_POST['captcha']) != 0){
  //----mismatch values
}

But the same thing in js I have tried like

var session = <?php echo $_SESSION['code'] ?>;  // this value is different 
                                                // from captcha image

Is it possible to validate captcha before submitting the form in Javascript/jQuery?

Upvotes: 2

Views: 23257

Answers (5)

Anubhav
Anubhav

Reputation: 1625

Create one ajax request for checking capcha using JavaScript, example is provided below:

var postData = $("form").serialize();
var requestUrl = '/check_capcha.php';
         $.ajax({
             type: "POST",
             dataType: "json",
             data: postData,
             url: requestUrl,
             success:function(data){
                // success or fail message

             }
         });

check_capcha.php contains:

if(strcasecmp($_SESSION['code'], $_POST['captcha']) != 0){
  //----mismatch values
echo 0;
}else{
echo 1;
}
exit;

Upvotes: 1

gargAman
gargAman

Reputation: 121

You can try the below code to validate the captcha or you can also use AJAX code to validate the values before submitting the code.

<script language="JavaScript">
    var session = '<?php echo $_SESSION['code'] ?>';
    if(Form.captcha.value == session)
    {
      return true;
    }
    else
    {
      Form.submit();
    }
    </script>

Upvotes: 0

Agha Umair Ahmed
Agha Umair Ahmed

Reputation: 1020

html look like this 

  $rand = mt_rand(100000,999999);
  <span class="captcha"><?php echo $rand; ?></span>
  <input name="captcha" type="text" id="captcha-compare" />

In javascript use something like that for validation engine

 $('#frm-register').submit(function() {
    if( $('#captcha-compare').val() != $('.captcha').text() ) {
        $('#captcha-compare').validationEngine('showPrompt', 'Invalid captcha', 'load');
        return false;
    }
 });

and in php first take $rand in session then submitting capture the input text captcha and session

Upvotes: 0

Tusar
Tusar

Reputation: 769

You can put the javascript code before (although session is same throughout the page). Just try a dummy code in a plain file and check the session value OR You can use $.ajax() to call PHP page for captcha validation

Upvotes: 0

bansi
bansi

Reputation: 56982

Assuming the line var session = <?php echo $_SESSION['code'] ?>; is in your html page.

When the page is generated your captcha image script is not invoked and thus $_SESSION['code'] is not initialized. The value you are getting is the code from the previous request to captcha_code_file.php. Once your page is loaded (at-least the html part) and the browser decides to call captcha_code_file.php your captcha image gets invoked and a new $_SESSION['code'] is created.

I don't recommend this, but if you want to get the current $_SESSION['code'] try to use an Ajax request to retrieve the new $_SESSION['code'] from another php file (don't call captcha_code_file.php or your session will be reset again.

Note: Never try to validate your captcha at user end. You are defeating the main purpose of captcha.

Upvotes: 1

Related Questions