【问题标题】:Ajax form success and fail message not workingAjax 表单成功和失败消息不起作用
【发布时间】:2013-07-11 17:26:41
【问题描述】:

我网站上的表格是一个简单的联系表格。 当表单发送/失败而不重新加载页面时,我希望表单在同一页面上显示“成功和失败”消息。我知道我应该使用 Ajax 来做到这一点,但我无法让它工作。它一直说失败,但表单已发送并在我的收件箱中。

这是我正在使用的代码。

Html(单页设计):

<form accept-charset="UTF-8" action="" class="form" id="contactus" method="post" name="contactus">
  <label for="nametag">Namn*</label> <input id="name" name="name" type="text" value=""> 
  <label for="emailtag">Email*</label> <input id="email" name="email" type="text" value=""> 
  <label for="phonetag">Telefon</label> <input id="phone" name="phone" type="text" value=""> 
  <label for="messagetag">Meddelande*</label><br>
  <textarea id="message" name="message" style="width: 87%; height: 200px;"></textarea> 
<label class="placeholder">&nbsp;</label> <button class="submit" name="submit">Skicka</button>
</form>

<script>

        $(function() {
                $('#contactus').submit(function (event) {
                    event.preventDefault();
                    event.returnValue = false;
                    $.ajax({
                        type: 'POST',
                        url: 'php/mail.php',
                        data: $('#contactus').serialize(),
                        success: function(res) {alert(res);
                            if (res == 'successful') {
                                $('#status').html('Sent').slideDown();
                            }
                            else {
                                $('#status').html('Failed').slideDown();
                            } 
                        },
                        error: function () {
                            $('#status').html('Failed').slideDown();
                        }
                    });
                });
            });
</script>

PHP:

<?php
    $name = $_POST['name'];
    $email = $_POST['email'];
    $phone = $_POST['phone'];
    $message = $_POST['message'];
    $recipient = "info@mydomain.com";
    $subject = "Webbkontakt";
    $formcontent = "Från: $name <br/> Email: $email <br/> Telefon: $phone <br/> Meddelande: $message";

    $headers = "From: " ."<info@mydomain.com>" . "\r\n";
    $headers .= "Reply-To: ". "no-reply@mydomain.com" . "\r\n";
    $headers .= "MIME-Version: 1.0\r\n";
    $headers .= "Content-Type: text/html; charset=utf-8\r\n";

    if(mail($recipient, $subject, $formcontent, $headers))
    {
        echo "successful";
    }
    else
    {
        echo "error";
    }
?>

【问题讨论】:

  • 服务器对 AJAX 调用的响应是什么?
  • 对不起,我是个菜鸟,但我该如何检查呢?我是新手。
  • alert(res) 显示什么?
  • 哦,显示成功
  • @user2566091:使用浏览器调试工具,您可以监控网络请求和响应。例如,在 Firebug 中,有一个“网络”选项卡会显示此内容。

标签: php ajax forms


【解决方案1】:

将@符号放在邮件前面。如果邮件被成功接受传递,则返回 TRUE,否则返回 FALSE。重要的是要注意,仅仅因为邮件被接受交付,并不意味着邮件实际上会到达预定目的地。 - 换句话说,如果电子邮件已发送,您无法使用 PHP 检测。

if(@mail($recipient, $subject, $formcontent, $headers))
{
    echo "successful";
}else{
   echo "error";
}

然后在AJAX中将成功和错误改成如下:

success: function(res) {
    if (res != "successful") { 
        $('#status').html('Failed').slideDown(); 
    } else { 
        $('#status').html('Sent').slideDown(); 
    } 
},

error: function(XMLHttpRequest, textStatus, errorThrown) { 
    alert("Error From AJAX"); 
},

【讨论】:

  • 我现在这样做了。你能看看上面的链接吗?
  • 您知道您的消息文本框在表单之外的另一个 div 中吗?另外,您仍然遇到错误吗?
  • 我移动了文本框,是的,我仍然在页面上看到“失败”的文本,但弹出窗口显示成功。表单出现在我的收件箱中。
  • 尝试在 AJAX 中更改错误函数,如下所示: error: function(XMLHttpRequest, textStatus, errorThrown) { alert("Error From AJAX");这样就可以看到失败的错误是从哪里来的。
  • 尝试时没有变化。 ://
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2014-12-18
  • 1970-01-01
  • 1970-01-01
  • 2016-04-29
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多