ajax从php跳过响应

时间:2017-02-03 09:48:18

标签: javascript php jquery ajax

我试图通过AJAX传递PHP回显值,但是在成功函数上,AJAX会跳过if和else条件并执行else语句,即使满足if条件也是如此。

下面是我的php和ajax代码

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> &nbsp; posting ...');
        },
        success :  function(response)
           {                        
                if(response == "ok"){

                    $("#btn-postAdd").html('<img src="btn-ajax-loader.gif" /> &nbsp; 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> &nbsp; Sorry, add item name</div>');
                        $("#btn-postAdd").html('<span class="glyphicon glyphicon-log-in"></span> &nbsp; SIGN U');
                        });

                }
                else{

                    $("#error").fadeIn(1000, function(){                        
            $("#error").html('<div class="alert alert-danger"> <span class="glyphicon glyphicon-info-sign"></span> &nbsp; '+response+' !</div>');
                                        $("#btn-postAdd").html('<span class="glyphicon glyphicon-log-in"></span> &nbsp; Submit Item');
                                });
                }
          }
        });
            return false;
    }
   /* postadd submit */
});

HTML代码

<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> &nbsp; Submit Item 
                                           </button>
                                    </div>
                                </fieldset>
                            </form>
                        </div>

2 个答案:

答案 0 :(得分:0)

我不确定但是你的echo会尝试json_encode并添加一个console.log(响应)来检查返回

   if($insertItem = $postItem->postAdd($istate,$iname)){
        echo json_encode("ok"); //sucessfully inserted
    } 

   if(empty($iname)){
        echo json_encode('1'); //check if iten name is empty
   }

答案 1 :(得分:0)

这应该有效,我不认为你的PHP实际上需要检查名称是否为空,你已经使用`jquery.validate();&#39;

关于您的成功,请删除此

else if(response == "1"){
                    $("#error").fadeIn(1000, function(){
                        $("#error").html('<div class="alert alert-danger"> <span class="glyphicon glyphicon-info-sign"></span> &nbsp; Sorry, add item name</div>');
                        $("#btn-postAdd").html('<span class="glyphicon glyphicon-log-in"></span> &nbsp; SIGN U');
                        });

                }

以及你的php删除此

if(empty($iname)){
    echo '1'; //check if iten name is empty
}

您已在validate()

中遵守规则

然后您的代码将如下所示:

<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
  crossorigin="anonymous"></script>
<script type="text/javascript" src="admin_assets/js/validation.min.js"></script>// ignore this was for my test
<script type="text/javascript">

  $('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> &nbsp; posting ...');
        },
        success :  function(response)
           {                        
                if(response == "ok"){

                    $("#btn-postAdd").html('<img src="btn-ajax-loader.gif" /> &nbsp; Submiting item ...');
                    setTimeout(' window.location.href = "index.php"; ',4000);
                }
                else{

                    $("#error").fadeIn(1000, function(){                        
            $("#error").html('<div class="alert alert-danger"> <span class="glyphicon glyphicon-info-sign"></span> &nbsp; '+response+' !</div>');
                                        $("#btn-postAdd").html('<span class="glyphicon glyphicon-log-in"></span> &nbsp; Submit Item');
                                });
                }
          }
        });
            return false;
    }
   /* postadd submit */
});
</script>


<div id="error"></div>

<form method="POST" id="postAddForm" action="">
  <input type="text" name="txt_istate" id="txt_istate">
  <input type="text" name="txt_iname" id="txt_iname">
  <button type="submit" name="btn-postAdd" id="btn-postAdd">submit</button>
</form>

忽略我的表单,这是我的测试目的。您的表单已经

然后你的php

<?php

if (isset($_POST['btn-postAdd'])) {

    $istate = strip_tags($_POST['txt_istate']);
    $iname  = strip_tags($_POST['txt_iname']);

    try {
        if ($insertItem = $postItem->postAdd($istate, $iname)) {
            echo "ok"; //sucessfully inserted
        } else {

            echo "could not add item";
        }
    }
    catch (PDOException $e) {
        echo $e->getMessage();
    }
}
?>

你现在好了。

另请考虑Auris的评论。