提交表單，留在同一頁面並留言確認

我有一個表格，當我提交時，它會轉到另一個頁面。爲了解決這個問題，我在html中留下了空的action字段。但是現在，php不發送郵件。
我想留在同一頁面上，發送郵件並獲得消息確認。我對此沒有太多瞭解，而且我無法自己修復。下面是代碼：提交表單，留在同一頁面並留言確認

<form id="idForm"method="post" action=""> 
        <div class="row 50%"> 
         <div class="6u 12u$(mobile)"><input id="nome" required="required" type="text" class="text" name="name" placeholder="Nome" /></div> 
         <div class="6u$ 12u$(mobile)"><input id="email" required="required" type="email" class="text" name="email" placeholder="Correo electrónico" /></div> 
         <div class="12u$"> 
          <textarea id="mensaxe" required="required" name="mensaxe" placeholder="Mensaxe"></textarea> 
         </div> 
         <div class="12u$"> 
          <ul class="actions"> 
           <li><input type="submit" value="Enviar mensaxe" /> 
           <span id="message"></span> 

           </li> 
          </ul> 
         </div> 
        </div> 
       </form>

這裏的PHP

<?php 
if(isset($_POST['email'])) { 

// Debes editar las próximas dos líneas de código de acuerdo con tus preferencias 
$email_to = "[email protected]"; 
$email_subject = "Contacto desde el sitio web"; 

// Aquí se deberían validar los datos ingresados por el usuario 
if(!isset($_POST['name']) || 
!isset($_POST['email']) || 
!isset($_POST['mensaxe'])) { 

echo "<b>Ocurrió un error y el formulario no ha sido enviado. </b><br />"; 
echo "Por favor, vuelva atrás y verifique la información ingresada<br />"; 
die(); 
} 

$email_message = "Detalles del formulario de contacto:\n\n"; 
$email_message .= "Nombre: " . $_POST['name'] . "\n"; 
$email_message .= "E-mail: " . $_POST['email'] . "\n"; 
$email_message .= "Comentarios: " . $_POST['mensaxe'] . "\n\n"; 


// Ahora se envía el e-mail usando la función mail() de PHP 
$headers = 'From: '.$email_from."\r\n". 
'Reply-To: '.$email_from."\r\n" . 
'X-Mailer: PHP/' . phpversion(); 
@mail($email_to, $email_subject, $email_message, $headers); 


} 
?>

而且JS

$("#idForm").submit(function() { 
    event.preventDefault(); 

    var url = "../php/formulario.php"; // the script where you handle the form input. 

    $.ajax({ 
      type: "POST", 
      url: url, 
      data: $("#idForm").serialize(), // serializes the form's elements. 
      success: function(data) 
      { 
       $("message").text("Success Message"); 
      } 
     }); 

    return false; // avoid to execute the actual submit of the form. 
});

我感謝所有幫助！謝謝。

來源

2016-04-29 Olalla Fronkonstin

在您的腳本中使用'header（'Location：url'） ;'回到頁面。或者只是在同一頁面上包含腳本並使用ajax發佈到同一頁面 – Matt

event.preventDefault應該做你需要的，但是在你的js中它看起來並不像你在事件中傳遞的那樣，試着做$（ '#idForm'）。submit（function（event）{..... –

你也在你的jQuery中缺少一個'＃'，應該是'$（'＃message'）。text（...） – ImClarky

事件中缺少的功能參數

$("#idForm").submit(function(event) {

來源

2016-04-29 09:42:23

在你的js

，你必須像這樣的改變：

$("#idForm").submit(function(e) { 
    e.preventDefault();

不通過郵局在同一個頁面發送的形式（動作空=同一頁）

而在你的AJAX技術，你有一個錯誤：

$("message").text("Success Message"); 
$("#message").text("Success Message"); //CORRECT with #

您可以更改函數（html）的函數（數據），併發出警報（html）以查看php頁面說的內容;;）

來源

2016-06-25 21:30:44 Amazone

提交表單，留在同一頁面並留言確認

回答

相關問題