2017-09-13 96 views
2

我有一個使用jQuery的表單提交& PHPMailer()。如果存在錯誤,則它們將顯示在表單上方,例如「名稱是必填字段」,但是,如果所有字段都填寫正確,表單仍會在頂部顯示空的alert alert-danger框,並且不會提交。當沒有錯誤存在時jQuery ajax表單不提交

jQuery的

var form = jQuery("#contact-form"); 
form.submit(function(e) { 
    e.preventDefault(); 
    jQuery('#submit').attr("disabled", true); 
    jQuery.ajax({ 
     url:  '/process-contact.php', 
     type:  'POST', 
     data:  form.serialize(), 
     dataType: 'json' 
    }).done(function(data) { 
     jQuery('#messages').removeClass(); 
     if (data.code === 1) { 
      form[0].reset(); 
      jQuery('#messages').addClass('alert alert-success'); 
      jQuery('#submit').attr("disabled", false); 
     } 
     else { 
      jQuery('#messages').addClass('alert alert-danger'); 
      jQuery('#submit').attr("disabled", false); 
     } 
     jQuery('#messages').html(data.message); 
     jQuery('html, body').animate({ 
      scrollTop: jQuery("#messages").offset().top 
     }, 1000); 
    }); 
}); 

HTML

<form class="contactForm" id="contact-form" name="contact-form"> 
    <div class="row"> 
     <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6"> 
      <div class="form-group"> 
       <label for="name">Name</label> 
       <input class="form-control" id="name" name="name" placeholder="Your Name" type="text"> 
      </div> 
      <div class="form-group"> 
       <label for="email">Email Address</label> 
       <input class="form-control" id="email" name="email" placeholder="Your Email" type="text"> 
      </div> 
      <div class="form-group"> 
       <label for="subject">Subject</label> 
       <input class="form-control" id="subject" name="subject" placeholder="Subject" type="text"> 
      </div> 
     </div> 
     <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6"> 
      <div class="form-group"> 
       <label for="name">Message</label> 
       <textarea class="form-control" name="message" placeholder="Message"></textarea> 
      </div> 
     </div> 
     <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> 
      <button class="btn btn-skin pull-right" name="submit" id="submit" type="submit">Send Message</button> 
     </div> 
    </div> 
</form> 
+0

來自哪裏這個'警報警報的danger'盒?不在任何你已經*顯示的代碼* –

+0

你可以console.log數據,看看裏面有什麼。錯誤可能在於表單處理,而不是JS。 – niorad

+0

@JaromandaX它在表格上方的div中,

,這是出現錯誤/成功消息的地方 – user7723458

回答

0

每次取出後級alert-danger點擊

form.submit(function(e) { 
jQuery('#messages').removeClass('alert-danger'); 
........