doumaque6551
2015-04-13 20:00
浏览 53

通过电子邮件和显示消息发送表单数据,无需刷新或更改页面

I have this form, it works perfectly but when submitted/failed it swaps to another page where the message is showed.

HTML

<form action="envio.php" method="post">
    <label>Nombre </label>
    <input type="text" name="name"><br>
    <label>Email</label> 
    <input type="text" name="email"><br>
    <label>Teléfono</label> 
    <input type="text" name="phone"><br>
    <label>Mensaje</label>
    <textarea name="message"></textarea><br>
    <input id="submit" type="submit" name="submit" value="Enviar">
</form>

envio.php

if(isset($_POST['submit'])){
    $to = "email@gmail.com"; // email destinatario
    $from = $_POST['email']; // email del cliente
    $name = $_POST['name'];
    $phone = $_POST['phone'];
    $mes = $_POST['message'];
    $subject = "Formulario web";
    $subject2 = "Copia de su formulario de consulta";
    $message = $name . " con número de teléfono: " . $phone . " escribió lo siguiente:" . "

" . $_POST['message'];
    $message2 = "Aquí tiene una copia de su mensaje " . $name . "

" . $_POST['message'];

    $headers = "From:" . $from;
    $headers2 = "From:" . $to;
    $success = (preg_match("/^[0-9]{9}$/",$phone) && preg_match("/^[a-zA-Z]*$/",$name) && $mes!='' && filter_var($from, FILTER_VALIDATE_EMAIL));

    if ($success){
        mail($to,$subject,$message,$headers);
        mail($from,$subject2,$message2,$headers2); // copia para el cliente
        echo "Formulario enviado. Muchas gracias " . $name . ", en breve contactaremos con usted.";
    }
    else {
        echo "Lo sentimos, se ha producido un error al enviar el formulario, revise su contenido y vuelva a intentarlo.";
    }}

I just want to show the messages in the if/else under the 'send' button after click it, without refresh, I think it can be done with JQuery/Vanilla but I have no clue. How can JS know if the form was submitted successfully? How can I tell JS where to insert the message?

  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • dtdd25012 2015-04-13 20:39
    已采纳

    Further to my comments and because it's hard to explain in such a little space:

    page1.php

        <!-- Name the form myform as an id -->
        <form action="page2.php" method="post" id="myform">
            <label>Nombre </label>
            <input type="text" name="name"><br>
            <label>Email</label> 
            <input type="text" name="email"><br>
            <label>Teléfono</label> 
            <input type="text" name="phone"><br>
            <label>Mensaje</label>
            <textarea name="message"></textarea><br>
            <input id="submit" type="submit" name="submit" value="Enviar">
        </form>
        <!-- Invisible response container -->
        <div id="response"></div>
    <script>
        $("#myform").submit(function() {
            $.ajax({
                     // PHP page  
                     url : 'page2.php',
                     // Takes all data from form
                     data: $("#myform").serialize(),
                     // Puts response into the container
                     success: function(response) {
                        $("#response").html(response);
                     }
            });    
            // This stops the page from reloading on submit
            return false;
        });
    </script>
    

    page2.php

    if(isset($_POST['submit'])){
        $to = "email@gmail.com"; // email destinatario
        $from = $_POST['email']; // email del cliente
        $name = $_POST['name'];
        $phone = $_POST['phone'];
        $mes = $_POST['message'];
        $subject = "Formulario web";
        $subject2 = "Copia de su formulario de consulta";
        $message = $name . " con número de teléfono: " . $phone . " escribió lo siguiente:" . "
    
    " . $_POST['message'];
        $message2 = "Aquí tiene una copia de su mensaje " . $name . "
    
    " . $_POST['message'];
    
        $headers = "From:" . $from;
        $headers2 = "From:" . $to;
        $success = (preg_match("/^[0-9]{9}$/",$phone) && preg_match("/^[a-zA-Z]*$/",$name) && $mes!='' && filter_var($from, FILTER_VALIDATE_EMAIL));
    
        if ($success){
            mail($to,$subject,$message,$headers);
            mail($from,$subject2,$message2,$headers2); // copia para el cliente
            echo "Formulario enviado. Muchas gracias " . $name . ", en breve contactaremos con usted.";
        }
        else {
            echo "Lo sentimos, se ha producido un error al enviar el formulario, revise su contenido y vuelva a intentarlo.";
        }
    }
    
    已采纳该答案
    打赏 评论

相关推荐 更多相似问题