I am trying to pass PHP echo values through AJAX, but on success function AJAX skips the if and else conditions and executes the else statements even when the if condition is met.
Below is my php and ajax code
process_postadd.php
if(isset($_POST['btn-postAdd'])){
$istate = strip_tags($_POST['txt_istate']);
$iname = strip_tags($_POST['txt_iname']);
if(empty($iname)){
echo '1'; //check if iten name is empty
}
else{
try
{
if($insertItem = $postItem->postAdd($istate,$iname)){
echo "ok"; //sucessfully inserted
}
}
catch(PDOException $e)
{
echo $e->getMessage();
}
}
}
script.js
$('document').ready(function()
{
/* validation */
$("#postAddForm").validate({
rules:
{
txt_istate: {
required: true
},
txt_iname: {
required: true
},
},
messages:
{
txt_istate: {
required: "state required"
},
txt_iname: {
required: "item name required"
},
},
submitHandler: submitForm
});
/* validation */
/* postadd submit */
function submitForm()
{
var data = $("#postAddForm").serialize();
$.ajax({
type : 'POST',
url : 'process_postadd.php',
data : data,
beforeSend: function()
{
$("#error").fadeOut();
$("#btn-postAdd").html('<span class="glyphicon glyphicon-transfer"></span> posting ...');
},
success : function(response)
{
if(response == "ok"){
$("#btn-postAdd").html('<img src="btn-ajax-loader.gif" /> Submiting item ...');
setTimeout(' window.location.href = "index.php"; ',4000);
}
else if(response == "1"){
$("#error").fadeIn(1000, function(){
$("#error").html('<div class="alert alert-danger"> <span class="glyphicon glyphicon-info-sign"></span> Sorry, add item name</div>');
$("#btn-postAdd").html('<span class="glyphicon glyphicon-log-in"></span> SIGN U');
});
}
else{
$("#error").fadeIn(1000, function(){
$("#error").html('<div class="alert alert-danger"> <span class="glyphicon glyphicon-info-sign"></span> '+response+' !</div>');
$("#btn-postAdd").html('<span class="glyphicon glyphicon-log-in"></span> Submit Item');
});
}
}
});
return false;
}
/* postadd submit */
});
HTML code
<div class="col-sm-12">
<div id="error">
<!-- error will be shown here ! -->
</div>
<form method= "POST" class="form-horizontal" enctype="multipart/form-data" id="postAddForm">
<fieldset>
<div class="form-group">
<label class="col-md-3 control-label">Item condition</label>
<div class="col-md-8">
<label class="radio-inline" for="radios-00">
<input name="txt_istate" id="radios-00" value="New"
type="radio">
New</label>
<label class="radio-inline" for="radios-11">
<input name="txt_istate" id="radios-11" value="Used"
type="radio">
Used </label>
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label" for="Adtitle">Item Name</label>
<div class="col-md-8">
<input id="Adtitle" name="txt_iname" placeholder="name of item"
class="form-control input-md" type="text">
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label"></label>
<button class="btn btn-success" name="btn-postAdd" id="btn-postAdd" type="submit">
<span class="glyphicon glyphicon-log-in"></span> Submit Item
</button>
</div>
</fieldset>
</form>
</div>