通过Ajax提交的表单在错误响应中返回[object Object]

时间:2016-02-26 22:46:55

标签: javascript php jquery ajax forms

表格:

<form class="col-md-4 col-sm-12 col-xs-12 pull-right banner-contact-form" onSubmit="return support_send();" id="contact_form" name="contact_form">

        <div class="col-xs-12 text-center">
            <h3>Application Form</h3>
        </div>
        <div class="form-group col-sm-4">
            <select class="form-control input-md" id="title" name="title" required>
                <option value="" selected hidden>Title</option>
                <option value="1">Mr</option>
                <option value="2">Mrs</option>
                <option value="3">Miss</option>
                <option value="4">Ms</option>
            </select>
        </div>
        <div class="form-group col-sm-8">
            <input type="text" class="form-control input-md" id="contact_name" placeholder="Your Full Name" name="contact_name" required>
        </div>
        <div class="form-group col-sm-12">
            <input type="text" class="form-control input-md" id="post_code" placeholder="Postcode" name="post_code" required>
        </div>
        <div class="form-group col-sm-12">
            <select class="form-control input-md" id="product" name="product" required>
                <option value="" selected hidden>Main product interested in</option>
                <option value="1">Washing Machines</option>
                <option value="2">Washer Dryers</option>
                <option value="3">Tumble Dryers</option>
                <option value="4">Dishwashers</option>
            </select>
        </div>
        <div class="form-group col-sm-12">
            <input type="tel" class="form-control input-md" id="contact_telephone_number" placeholder="Contact Telephone Number" name="contact_telephone_number" required>
        </div>
        <div class="form-group col-sm-12">
            <input type="email" class="form-control input-md" id="email" placeholder="Email Address" name="email">
        </div>
        <div class="col-xs-12">
            <button type="submit" class="btn btn-default col-xs-12 btn btn-success"><span class="banner-contact-form-submit">Apply today</span><br><small>no obligation | fast response</small></button>
        </div>
        <div class="col-xs-12">
            <p id="message_result" class="text-center"></p>
            <p class="text-center"><span class="banner-contact-form-apr">68.9% APR</span> representative <br /> (64.9% APR existing customers)</p>
        </div>
    </form>

Ajax处理程序:

function support_send(){
$.ajax( {
    type: "POST",
    url: "includes/contact_handler.php",
    data: $('#contact_form').serialize(),
    dataType: 'text',
    success: function( response ) {
        alert("It worked");
    },
        error: function(response) {
        alert(response);
    }
});
event.preventDefault()
};

Php Handler:

<?php
$name = addslashes($_POST['title'];)
$name = addslashes($_POST['contact_name'];)
$email = addslashes($_POST['email'];)
$telephone = addslashes($_POST['contact_telephone_number'];)
$post_code = addslashes($_POST['post_code'];)
$product = addslashes($_POST['product'];)
$from = 'From: Contact Us Form'; 
$to = 'info@mmulholland.co.uk'; 
$subject = 'New Contact Enquiry';

$body = "From: $name\n E-Mail: $email\n product:\n $product";

if (!empty($_POST)) {                
    if (mail ($to, $subject, $body, $from)) { 
    echo '<p>Your message has been sent!</p>';
} else { 
    echo '<p>Something went wrong, go back and try again!</p>'; 
} 
}
?>

我正在尝试通过ajax提交联系表单,然后通过电子邮件发送给客户端,我的问题是它不断返回[object Object]的错误响应。

我认为问题在于提交表单中的某些字段是对象,但我无法弄清楚如何解决此问题。

非常感谢任何帮助。

感谢。

2 个答案:

答案 0 :(得分:0)

尝试:

error: function(xhr, status, error) {
  var err = eval("(" + xhr.responseText + ")");
  alert(err.Message);
}

答案 1 :(得分:0)

alert不是调试工具。它将其参数转换为字符串。对象的字符串表示形式为[object Object]

alert({value: 42}) // shows [object Object]

Use console.log instead.同时确保read the documentation of the API you are usingerror回调的签名是

  

Function( jqXHR jqXHR, String textStatus, String errorThrown )

所以你想记录第二个和第三个参数:

error: function(jqXHR, status, error) {
  console.log('Status:', status);
  console.log('Error:', error);
}

然后你会知道问题是什么,并且可以开始修复它。