提交表单,留在同一页面并确认邮件

时间:2016-04-29 09:36:57

标签: javascript php jquery ajax forms

我有一个表单,当我提交表单时,它会转到另一个页面。 为了解决这个问题,我在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 = "info@mymail.es";
$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.
});

我感谢任何帮助!!感谢。

2 个答案:

答案 0 :(得分:2)

函数参数

中缺少

事件

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

答案 1 :(得分:0)

在你的js中,你必须改变这样:

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

不通过邮寄方式发送同一页面中的表格(动作空=同一页面)

在你的ajax中,你有一个错误:

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

你可以改变函数(html)的函数(数据)并发出警告(html)以查看php页面说的内容..;)