在ajax上獲取XMLHttpRequest錯誤

Question

我有一種模式，其中有一種表單，我希望用戶能夠提交電子郵件。我像往常一樣設置ajax文章，但是，這篇文章一直在失敗。當它發生時，控制檯中會出現以下兩個錯誤。

1. 同步請求設置XMLHttpRequest.withCredentials已被棄用
2. 同步XMLHttpRequest的主線程上的，因爲其所帶來的影響最終用戶的體驗棄用。

有趣的是，有時電子郵件發送，無論錯誤的，但有時卻不會。

這裏是我的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); 
}); 

任何幫助，將不勝感激！

Answer 1

阿賈克斯成功後提交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 
});