在ajax Post上获取XMLHttpRequest错误

时间:2015-11-29 18:03:55

标签: javascript jquery html ajax asp.net-mvc-5

我有一个模式,其中有一个表单,我希望用户能够提交电子邮件。我像往常一样设置了ajax帖子,然而,帖子一直都失败了。如果是这样,我在控制台中收到以下两个错误。

  
      
  1. 不推荐为同步请求设置XMLHttpRequest.withCredentials
  2.   
  3. 主线程上的同步XMLHttpRequest因其对最终用户体验的不利影响而被弃用。
  4.   

有趣的是,无论错误如何,电子邮件有时会发送,但有时也不会发送。

这是我的Html:

<form class="cmxform" id="contactForm" >
    <div class="row">
        <div class="col-xs-6">    

                <label class="col-md-12 control-label" style="text-align: left;" >Name</label>
                <div class="col-md-12">
                    <input required class="form-control" id="FromName" name="FromName" style="margin-bottom: 10px;" type="text" value=""/>
                </div>

        </div>
        <div class="col-xs-6">

                <label class="col-md-12 control-label" style="text-align: left;" >Email</label>
                <div class="col-md-12">
                    <input required class="form-control" style="margin-bottom: 10px;" id="FromEmail" name="FromEmail" type="text" value=""/>
                </div>

        </div>

    </div>

        <label class="col-md-12 control-label" >Message</label>
        <div class="col-md-12">
            <textarea required class="form-control contact-message" cols="20"  id="Message" name="Message" rows="2"></textarea>

        </div>


    <div class="col-md-12">
        <input type="submit" class="btn btn-info" value="Submit" />
    </div>


</form>

我的JS:

function sendMessage(messageData) {

    $.ajax({
        async: true,
        url: '/api/SendMessageApi',
        type: 'POST',
        data: messageData,
        success: function () {

        },
        error: function (ex) {
            alert('there was an error');
        }
    });
}


$("#contactForm").submit(function () {

    var name = $('#FromName').val();
    var email = $('#FromEmail').val();
    var message = $('#Message').val();

    var messageData = { Name: name, Email: email, Message: message };

    sendMessage(messageData); 
});

非常感谢任何帮助!

1 个答案:

答案 0 :(得分:1)

要在ajax成功后提交form,您可以使用:

function sendMessage(messageData) {

    $.ajax({
        context: this, // set context to the form
        async: true,
        url: '/api/SendMessageApi',
        type: 'POST',
        data: messageData,
        success: function () {
            this.submit(); // submit form on success
        },
        error: function (ex) {
            alert('there was an error');
        }
    });
}


$("#contactForm").submit(function (e) {
    e.preventDefault();
    var name = $('#FromName').val();
    var email = $('#FromEmail').val();
    var message = $('#Message').val();

    var messageData = { Name: name, Email: email, Message: message };

    sendMessage.call(this, messageData); // set context to the form
});