如何使用jQuery AJAX電子郵件表單獲得「成功」

Question

我在網站上創建了一個簡單的電子郵件表單 - 使用jQuery庫通過AJAX處理它。

我知道表單正在工作，因爲我正在收到測試電子郵件，但我需要讓用戶知道他們的電子郵件已發送。目前，成功後不會發生任何事件。它應該用成功消息替換窗體（在div #contactform中）。我在這裏錯過了什麼？

注意：我在提交表單後查看了Safari中的活動，它顯示了我的process.php腳本，但它說「已取消」。它爲什麼這樣做，它可能與它爲什麼沒有顯示成功信息有關？

這裏是我的腳本：

HTML

<div id="contactform"> 
    <form id="churchcontact" action="" method="POST"> 

     <ul> 
      <li> 
       <label for="name">Name</label> 
       <span class="error error_name">Please enter your name</span> 
       <input id="name" type="text" name="name" /> 
      </li> 

      <li> 
       <label for="email">Email</label> 
       <span class="error error_email">Please enter your email address</span> 
       <input id="email" type="text" name="email" /> 
      </li> 

      <li> 
       <label for="message">Message</label> 
       <span class="error error_message">Please write a message</span> 
       <textarea id="message" name="message"></textarea> 
      </li> 

      <li> 
       <input class="formsubmit" type="submit" value="Send" /> 
      <li> 
     </ul> 

    </form> 
    </div> 

jQuery的

$(document).ready(function() { 


    //////////////////////////////////// 
    //// form submit    //// 
    //////////////////////////////////// 
    $('#churchcontact').submit(function() { 


     //////////////////////////////////// 
     //// validation     //// 
     //////////////////////////////////// 
     $('.error').hide(); 

     //message 
     var message = $('textarea#message').val(); 
     if(message == '') { 
      $('.error_message').show(); 
      $('textarea#message').focus(); 
      var errors = 'true'; 
     } 


     //email 
     var email = $('input#email').val(); 
     var atpos = email.indexOf("@"); 
     var dotpos = email.lastIndexOf("."); 
     if (atpos<1 || dotpos<atpos+2 || dotpos+2>=email.length || email == '') { 
      $('.error_email').show(); 
      $('input#email').focus(); 
      var errors = 'true'; 
     } 

     //name 
     var name = $('input#name').val(); 
     if(name == '') { 
      $('.error_name').show(); 
      $('input#name').focus(); 
      var errors = 'true'; 
     } 




     if(errors) { 
      return false; 
     } else { 


      //////////////////////////////////// 
      //// process     //// 
      //////////////////////////////////// 

      var dataString = 'name='+ name + '&email=' + email + '&message=' + message; 
      //alert (dataString);return false; 
      $.ajax({ 
       type: "POST", 
       url: "sites/all/modules/custom/churchcontact/process.php", 
       data: dataString, 
       success: function() { 
        $('#contactform').html("success!"); 
       } 
      }); 



     } 

     return false; 

    }); 



}); 

PHP（process.php）

$name = $_POST['name']; 
$email = $_POST['email']; 
$msg = $_POST['message']; 


$recipient = '[my email]'; 
$subject = 'Website Test'; 

$message = ' 
Name: ' . $name 
. ', Email: ' . $email 
. ', Message: ' . $msg; 


mail($recipient, $subject, $message, $headers); 

Answer 1

在process.php添加的：

$res = mail($recipient, $subject, $message, $headers); 
echo $res;  //if $res returns 1 that means mail was sent 

AJAX success：

... 
success: function(data) { 
    if(data == 1){ 
     message = "success!"; 
    } 
    else{ 
     message = "Error"; 
    }  
    $('#contactform').empty().html(message); 
    }