如何显示错误消息Jquery ajax?

时间:2014-09-03 07:30:55

标签: javascript php jquery ajax

我是学生,正在使用jquery和php将记录添加到数据库中。正在添加记录,但我想在成功添加记录时显示“已插入记录”消息,如果发生错误则显示错误消息。

这是我的HTML代码:

<form id="forn-newsletter" class="form-horizontal" method="POST">
<div class="form-group">
    <label id="name_label" class="control-label col-xs-2">Name</label>
    <div class="col-xs-10">
        <input type="text" class="form-control" id="news_name" name="news_name" placeholder="Name" onblur="checkName();"/><font color="red"  id="name_error"></font>
    </div>
</div>

<div class="form-group">
    <label id="email_label" class="control-label col-xs-2">Email</label>
    <div class="col-xs-10">
        <input type="text" class="form-control" id="news_email" name="news_email" placeholder="Email" onblur="vali()"/><font color="red"  id="email_error"></font>
    </div>
</div>

<div class="form-group">
    <div class="col-xs-offset-2 col-xs-10">
        <button id="register-newsletter" type="submit" class="btn btn-primary">Register for Newsletter</button>

    </div>
</div>

<div id="dialog"></div>
</form>

这是我的registration-newsletter.php

<?php
include('connect.php');

$name=$_POST['name'];
$email=$_POST['email'];
$val=md5($name.$email);
$query = "INSERT INTO newsletter (Id,Name,Email,Val) VALUES('','$name','$email','$val')";


$result=mysql_query($query);
if(!$result){
    echo "Some error Occured..Please try later";
}
else{
    echo "Your details have been saved. Thank You ";
}

mysql_close($con);
?>

这是我的JQuery代码

$(document).ready(function(){
$("#register-newsletter").click(function(){
    var name=$("#news_name").val();
    var email=$("#news_email").val();

    var dataString="name="+name+"&email="+email;
    var request;
        request = $.ajax({
        url: "registration-newsletter.php",
        type: "POST",           
        data: dataString
        });

    //return false;
});

});

5 个答案:

答案 0 :(得分:3)

在html代码中添加一个范围以显示错误。

<span id="error"></span>

您已经回复了从PHP页面到ajax的消息。您可以执行mysql_affected_rows()来检查查询是否更新了表。

$result=mysql_query($query);
if(mysql_affected_rows()>0){    // return the number of records that are inserted
   echo "Your details have been saved. Thank You ";    // success
}
else{
    echo "Some error Occured..Please try later";   // failure
}
exit;

然后,您只需在标识为error的范围内显示回显的消息:

request = $.ajax({
        url: "registration-newsletter.php",
        type: "POST",           
        data: dataString,
        success:function(response)     // response from requested PHP page
        {
           $('#error').html(response);  // set the message as html of span
        }
        });

答案 1 :(得分:1)

  $.ajax({
                url: 'registration-newsletter.php',
                 type: 'post',
                 data:  dataString ,
                 success: function (msg) {
                  alert(msg);
                },
                error:function(msg)
                {
                alert(msg);
                }

            });

答案 2 :(得分:1)

jQuery.ajax({
    url: "myfile.php",
    type: "POST",           
    data: dataString,
    success:function(response)     /* this response is an array which is returning from the myfile.php */
    {
    $status = response['status'];
    if($status == 'success')
        {
        $('#message').html(response['msg']);
        }
    else 
        {
        $('#message').html(response['msg']);
        }
    }
    });

您添加成功的功能将处理“要附加的文本”或“要显示的警报”。它与if条件完全相同,如果响应成功,它将进入条件。

答案 3 :(得分:1)

这对形式提交有用(参见 .then 功能的2个参数):

<span id="result">Loading...</span>
<div id="form">
    <form>
        <input id="personId"> <-- put personID here<br>
        <input id="submit" type="submit" value="Generate">
    </form>
</div>

<script type="application/javascript">
    $(document).ready(function() {
        var submit = $('#submit');
        var res = $('#result');
        $('#form').submit(function() {
            submit.prop('disabled', true);
            res.text("Sending message...");

            $.ajax({
                url: '/rest/message',
                contentType: "application/json;charset=UTF-8",
                method: "POST",
                data: JSON.stringify({'personId': $('#personId').val()})
            }).then(function(result) { // OK
                res.text("Message was generated");
                submit.prop('disabled', false);
            }, function(reason) { // ERROR
                res.css('color', 'red').css('font-weight','Bold');
                res.text("An error has occurred: " + reason.responseJSON.message);
                submit.prop('disabled', false);
            });
            return false; // prevent default action
        });
    });
</script>

答案 4 :(得分:0)

error: function(xhr) {
    alert(xhr.responseText);
}

如果需要,您还可以在此 XHR 对象中获取 HTTP 状态代码或服务器发送的通用消息(例如“内部服务器错误”)。更多信息:https://api.jquery.com/jQuery.ajax/#jqXHR