Jquery PHP Captcha Validation

Question

I have used captcha for the form and if i try to click on submit (via mouse) even after giving the right captcha the warning I'mm getting is "Wrong Captcha", and the pathetic thing is if i press enter(via keyboard) even after giving the wrong captcha it will show the "Thank you" text.

index.php

    <img src="get_captcha.php" alt="" id="captcha" />
    <br clear="all" />
    <input name="code" class="smoothborder" type="text" id="code" required="required" onblur="checkcode(this.value)">
    <div id="wrong" class="error" style="display: none;">Wrong Captcha</div>
    </div>
    <img src="refresh.jpg" width="25" alt="" id="refresh" style="margin-top:66px;margin-left:10px;" />

    function checkcode(value){
        $('#wrong').hide();
        $.post( "contact.php",{ namevalue: "code" }, function( data ) {     
            var returndata = data;      
        if(returndata == value){            
        } else {            
            $('#wrong').show();
            $('#code').val('');         
        }  
    });
  }

Contact.php

    <?php
    ob_start();
    session_start();
    if(isset($_REQUEST['namevalue']) != ''){
        echo $_SESSION['random_number'];
    }else{
        $name =  $_POST['name'];
        $email =  $_POST['email'];
        $mobile =  $_POST['mobile_no'];
        $url =  $_POST['url'];
        $comment =  $_POST['comment'];
        $response =  $_POST['response'];
        $Chooseoption =  $_POST['ddlselectionvalue'];
        $to = 'thejasvi@1800xchange.com';   
        $from = $name . ' <' . $email . '>';

        $subject = 'Message from ' . $name; 
        $message = 'Select Option: ' . $Chooseoption . '<br/>
        Name: ' . $name . '<br/>
        Email: ' . $email . '<br/>
        Mobile No.: ' . $mobile . '<br/>    
        URL: ' . $url . '<br/>          
        Message: ' . nl2br($comment) . '<br/>
        Response: ' . $response . '<br/>';
        echo $result = sendmail($to, $subject, $message, $from);
        if ($result==1){
            $result = 'Thank you! We have received your message.';
            header('location:index.php?result='.$result);
            ob_flush();
            exit();
        }else{
            $result = 'Sorry, unexpected error. Please try again later';
            header('location:index.php?result='.$result);
            ob_flush();
            exit();
        } 
    }

    function sendmail($to, $subject, $message, $from) {
        $headers = "MIME-Version: 1.0" . "\r\n";
        $headers .= "Content-type:text/html;charset=iso-8859-1" . "\r\n";
        $headers .= 'From: ' . $from . "\r\n";

        $result = mail($to,$subject,$message,$headers);
        if ($result) return 1;
        else return 0;
    }
   ?>

Get_Captcha.php

    <?php
    session_start();
    $string = '';
    for ($i = 0; $i < 5; $i++) {
       $string .= chr(rand(97, 122));
    }

    $_SESSION['random_number'] = $string;
    $dir = 'fonts/';
    $image = imagecreatetruecolor(165, 50);
    $num = rand(1,2);
    if($num==1)
    {
       $font = "Capture it 2.ttf"; 
    }
    else
    {
       $font = "Molot.otf";
    }
    $num2 = rand(1,2);
    if($num2==1)
    {
       $color = imagecolorallocate($image, 113, 193, 217);
    }
    else
    {
       $color = imagecolorallocate($image, 163, 197, 82);
    }

    $white = imagecolorallocate($image, 255, 255, 255); 
    imagefilledrectangle($image,0,0,399,99,$white);
    imagettftext ($image, 30, 0, 10, 40, $color, $dir.$font,          $_SESSION['random_number']);
    header("Content-type: image/png");
    imagepng($image);
    ?>

score 1 · Answer 1 · edited May 23 '17 at 12:06

The problem is that you are checking your captcha on blur:

onblur="checkcode(this.value)"

meaning that the code will be execute only when the cursor will be moved from the captcha field to something else (like the button).

You might instead apply on the onsubit event of your form something like this:

<form ... onSubmit="return checkcode()" >

But in this case your function checkcode will also need to return true or false to make it work.

function checkcode(value){
        $('#wrong').hide();
        $.post( "contact.php",{ namevalue: "code" }, function( data ) {     
            var returndata = data;      
        if(returndata == value){    
            return true;        
        } else {            
            $('#wrong').show();
            $('#code').val('');  
            return false;       
        }  
    });

Here some more info on form validation: HTML/Javascript: Simple form validation on submit

score 0 · Answer 2 · answered Oct 07 '15 at 10:28

I didn't tried this code, simply wtighting with my logic I think its better if you are using one seperate page for captcha checking

function checkcode(value)
{
    $('#wrong').hide();
    $.post( "captchaCheck.php",{ namevalue: "code" }, 
    function( data )
    {     
        var returndata = data;      
        if(returndata != value){  
            $('#wrong').show();
            $('#code').val('');           
        }
    });
}

captchaCheck.php is

<?php 
ob_start();
session_start();
if(isset($_REQUEST['namevalue']) == $_SESSION['random_number']){
    echo $_SESSION['random_number'];
}
?>

Jquery PHP Captcha Validation

2 Answers2