用PHP形式和AJAX

-1

工作，我用下面的HTML表單內置自舉：用PHP形式和AJAX

<form class="register-form margin-bot-5" id="register-form" method="get"> 
    <div class="row"> 

     <div class="col-lg-6 col-md-6"> 
      <div class="required-field"> 
       <input name="heroFname" id="hero-fname" class="hero-input" type="text" placeholder="First Name"> 
      </div> <!--/ .required-field --> 
     </div> 

     <div class="col-lg-6 col-md-6"> 
      <div class="required-field"> 
      <input name="heroLname" id="hero-lname" class="hero-input" type="text" placeholder="Last Name"> 
      </div> 
     </div> 

     <div class="col-lg-12 col-md-12"> 
      <div class="required-field"> 
       <input name="heroEmail" id="hero-email" class="hero-input" type="text" placeholder="Email Address"> 
      </div> <!--/ .required-field --> 
     </div> 

     <div class="col-lg-6 col-md-6"> 
      <div class="required-field"> 
      <input name="heroPhone" id="hero-phone" class="hero-input" type="text" placeholder="Phone Number"> 
      </div> 
     </div> 

     <div class="col-lg-6 col-md-6"> 
      <div class="required-field"> 
      <input name="heroPostcode" id="hero-postcode" class="hero-input" type="text" placeholder="Postcode"> 
      </div> 
     </div> 

     <div class="col-lg-6 col-md-6"> 
      <div class="required-field"> 
      <input name="heroBedrooms" id="hero-bedrooms" class="hero-input" type="text" placeholder="No. Of Bedrooms"> 
      </div> 
     </div> 

     <div class="col-lg-6 col-md-6"> 
      <button id="hero-submit" type="submit" class="submit-btn" style="background: #e5ff00;color:black;text-transform: capitalize;">Get My Offer</button> 
     </div> 

    </div> 
</form>

與Java腳本驗證：

$('#hero-submit').click(function(e){ 

    // Stop form submission & check the validation 
    e.preventDefault(); 

    // Variable declaration 
    var error = false; 
    var fname = $('#hero-fname').val(); 
    var email = $('#hero-email').val(); 

    // Form field validation 
    if(fname.length == 0){ 
     var error = true; 
     $('#hero-fname').parent('div').addClass('field-error'); 
    }else{ 
     $('#hero-fname').parent('div').removeClass('field-error'); 
    } 
    if(email.length == 0 || email.indexOf('@') == '-1'){ 
     var error = true; 
     $('#hero-email').parent('div').addClass('field-error'); 
    }else{ 
     $('#hero-email').parent('div').removeClass('field-error'); 
    } 

    if(error == true){ 
     $('#hero-error-notification').addClass('show-up'); 
    }else{ 
     $('#hero-error-notification').removeClass('show-up'); 
    } 

    if(error == false){ 
     $.get("hero-form.php", $("#register-form").serialize(),function(result){ 
      if(result == 'sent'){ 
       $('#hero-success-notification').addClass('show-up'); 
       $('#hero-submit').addClass('disabled'); 
      } 
     }); 
    } 
});

和PHP代碼：

<?php 
$subject = 'Contact Form'; // Subject of your email 
$to = '[email protected]'; //Recipient's or Your E-mail 

$headers = 'MIME-Version: 1.0' . "\r\n"; 
$headers .= "From: " . $_REQUEST['heroEmail'] . "\r\n"; // Sender's E-mail 
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n"; 

$message .= 'ACCOUNT DETAILS: ' . "<br>"; 
$message .= 'Username: ' . $_REQUEST['heroUsername'] . "<br>"; 
$message .= 'First Name: ' . $_REQUEST['heroFname'] . "<br>"; 
$message .= 'Last Name: ' . $_REQUEST['heroLname'] . "<br>"; 
$message .= 'Email Address: ' . $_REQUEST['heroEmail'] . "<br>"; 
$message .= 'Post Code: ' . $_REQUEST['heroPostcode'] . "<br>"; 
$message .= 'No of Bedrooms: ' . $_REQUEST['heroBedrooms'] . "<br>"; 
$message .= 'Phone Number: ' . $_REQUEST['heroPhone']; 

if (@mail($to, $subject, $message, $headers)) 
{ 
    // Transfer the value 'sent' to ajax function for showing success message. 
    echo 'sent'; 
} 
else 
{ 
    // Transfer the value 'failed' to ajax function for showing error message. 
    echo 'failed'; 
} 
?>

問題是：

起初我是使用POST方法發送數據到服務器，但我有http錯誤「405方法不允許」

然後我編輯它使用GET，但我沒有收到任何郵件，我不知道問題出在哪裏。有人能幫我嗎？謝謝

來源

2017-07-30 Mohamed ElQadi

發送數據時應使用POST。如果你有METHOD NOT ALLOWED，我猜你正在使用某種框架/路由器或類似的東西？只需張貼到一個文件應該肯定會工作。 –

您還應該刪除PHP命令前的所有'@' - 標誌，因爲它們_suppress_錯誤。如果有什麼不起作用，你就會錯誤的。該頁面是返回發送還是失敗？ –

我的答案是否有效？ –

將表單方法轉換爲POST。

這就是php的樣子。

$headers .= "From: " . $_POST['heroEmail'] . "\r\n"; // Sender's E-mail 
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n"; 
$message .= 'ACCOUNT DETAILS: ' . "<br>"; 
$message .= 'Username: ' . $_POST['heroUsername'] . "<br>"; 
$message .= 'First Name: ' . $_POST['heroFname'] . "<br>"; 
$message .= 'Last Name: ' . $_POST['heroLname'] . "<br>"; 
$message .= 'Email Address: ' . $_POST['heroEmail'] . "<br>"; 
$message .= 'Post Code: ' . $_POST['heroPostcode'] . "<br>"; 
$message .= 'No of Bedrooms: ' . $_POST['heroBedrooms'] . "<br>"; 
$message .= 'Phone Number: ' . $_POST['heroPhone']; 

if (mail($to, $subject, $message, $headers)) { 
    // Your stuffs 
}

Java腳本的一部分（發現了一些問題）

$('#hero-submit').on('click', function(e){ 

    // Stop form submission & check the validation 
    e.preventDefault(); 

    // Variable declaration 
    var error = false; 
    var fname = $('#hero-fname').val(); 
    var email = $('#hero-email').val(); 

    // Form field validation 
    if(fname.length == 0){ 
     error = true; 
     $('#hero-fname').parent('div').addClass('field-error'); 
    }else{ 
     $('#hero-fname').parent('div').removeClass('field-error'); 
    } 
    if(email.length == 0 || email.indexOf('@') == '-1'){ 
     error = true; 
     $('#hero-email').parent('div').addClass('field-error'); 
    }else{ 
     $('#hero-email').parent('div').removeClass('field-error'); 
    } 

    if(error == true){ 
     $('#hero-error-notification').addClass('show-up'); 
    }else{ 
     $('#hero-error-notification').removeClass('show-up'); 
     $.ajax({ 
      url: 'hero-form.php', 
      type: 'POST', 
      data: $("#register-form").serializeArray(), 
      success: function(result){ 
      if(result == 'sent'){ 
       $('#hero-success-notification').addClass('show-up'); 
       $('#hero-submit').addClass('disabled'); 
      } 
     }); 
    } 
});

希望這個作品。

來源

2017-07-30 17:42:47

用PHP形式和AJAX

回答

相關問題