I am trying to validate captcha through ajax but its only giving me invalid captcha message ?
here is my ajax
<script>
$(document).ready(function(){
$('#submitcap').click(function(){
$.post("report.php", $("#formcap").serialize(), function(response) {
$('#error').html(response);
});
return false;
});
});
</script>
here is my html
<span id="error"></span>
<form method="GET" id="formcap">
<img src="<?php echo $baseUrl; ?>/captcha/captcha.php" id="captcha" /><br/>
<!-- CHANGE TEXT LINK -->
<a href="#" onclick="
document.getElementById('captcha').src='<?php echo $baseUrl; ?>/captcha/captcha.php?'+Math.random();
document.getElementById('captcha-form').focus();"
id="change-image">Not readable? Change text.</a><br/><br/>
<input type="text" name="captcha" id="captcha-form" style="width:100px" autocomplete="off" /><br/>
<input type="submit" id="submitcap"/>
</form>
Here is my PHP file
<?php
/** Validate captcha */
if (!empty($_REQUEST['captcha'])) {
if (empty($_SESSION['captcha']) || trim(strtolower($_REQUEST['captcha'])) !=$_SESSION['captcha']) {
$captcha_message = "Invalid captcha";
$style = "background-color: #FF606C";
} else {
$captcha_message = "Valid captcha";
$style = "background-color: #CCFF99";
}
$request_captcha = htmlspecialchars($_REQUEST['captcha']);
echo <<<HTML
<div id="result" style="$style">
<h2>$captcha_message</h2>
<table>
<tr>
<td>Session CAPTCHA:</td>
<td>{$_SESSION['captcha']}</td>
</tr>
<tr>
<td>Form CAPTCHA:</td>
<td>$request_captcha</td>
</tr>
</table>
</div>
HTML;
unset($_SESSION['captcha']);
}
?>
I dont know why i am getting Invalid captcha message If i validate this captcha without ajax it works fine