2017-09-13 10 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

をクリックして削除しますか? *表示されているコードではありません。 –

+0

あなたはconsole.logでデータを見ることができ、そこにあるものを見ることができます。このエラーはおそらくJSではなく、フォーム処理にあります。 – niorad

+0

@JaromandaXそのフォームの上のdivに

というエラーメッセージと成功メッセージが表示されます。 – user7723458

答えて

0

各後のクラスalert-dangerこの `警告アラートdanger`ボックスから来るん

form.submit(function(e) { 
jQuery('#messages').removeClass('alert-danger'); 
........ 
関連する問題