Question

stmaybe累了，但我不能做我想做的事。

在用户点击提交按钮（然后发送到我的电子邮件）后，我想要一个确认文字，例如“感谢您对此表单进行汇总”。这是一个单页网站。我知道我必须使用一些jQuery，一点ajax（为了不重新加载页面？）和我的PHP脚本的形式;将表格中填写的值发送到我的电子邮箱。（＆lt; - working）

有任何帮助吗？我已经有了另一种形式，它也在起作用。但那里不需要确认信息。

这是我到目前为止所得到的但似乎不起作用..

位于index.php的顶部

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

        $sujet = 'stuff - reservation';
        $monEmail = 'email@email.com'; <- my mail
        $headers ='From: '.$reservNom.'<email@email.com>';

        foreach ($_POST as $key => $value) {
            $message.=$key.' -> '.$value.'
';

 }

if(isset($_POST['lieu'])) 
 { 
       echo htmlentities($_POST['lieu']); 
 } 
if(isset($_POST['ambiance'])) 
 { 
       echo htmlentities($_POST['ambiance']); 
 } 
 if(isset($_POST['menu'])) 
 { 
       echo htmlentities($_POST['menu']); 
 } 


    // ini_set('sendmail_from', $email); 
    mail($monEmail, $sujet, $message, $headers);


}

?>

表格的所有div

<div id="form-reserv" class="page">

<div class="container">

    <!-- Title Page -->
    <div class="row">
        <div class="span12">
            <div class="title-page">
                <h2 class="title">Réservations</h2>
                <h3 class="title-description">Reservez sur internet vos <a href="#">dates</a>.</h3>
            </div>
        </div>
    </div>
    <!-- End Title Page -->

    <div class="row">
        <div class="span12">
            <form id="reserv-form" class="nl-form contact-form" method="post">
                <p>J'aimerais manger au/à 
                <select name="lieux">
                    <option value="null" selected>(cliquez ici)</option>
                    <option value="Parc">PdC</option>
                    <option value="Mont">MdA</option>
                    <option value="GP">GP</option>
                </select></p>
                <p>avec l'ambiance
                <select name="ambiance">
                    <option value="null" selected>(cliquez ici)</option>
                    <option value="Paradise">Paradise</option>
                    <option value="Heat">Heat</option>
                    <option value="Nature">Nature</option>

                </select></p>
                <p>et le menu
                <select name="menu">
                    <option value="null" selected>(cliquez ici)</option>
                    <option value="MP">Manneken Pies</option>
                    <option value="Atomnium">Atomnium</option>
                    <option value="Horta">Horta</option>
                </select></p>

            <br/>

                <p class="contact-name">
                    <input id="reservNom" type="text" placeholder="Votre nom" value="" name="reservNom" />
                </p>
                 <p class="contact-name">
                    <input id="reservPrenom" type="text" placeholder="Votre Prénom" value="" name="reservPrenom" />
                </p>
                <p class="contact-email">
                    <input id="reservEmail" type="text" placeholder="Votre E-mail" value="" name="reservEmail" />
                </p>
                <p class="contact-name">
                    <input id="nombre" type="text" placeholder="Nombre de personnes (Maximum 4 personnes)" max="4" name="nombre" />
                </p>
                <p class="contact-name">
                    <input id="date" type="date" placeholder="Format : JJ/MM/AAAA" step="6"/>
                </p>
                <p><input value="RESERVEZ" class="submit" id="submitReserv" name="submitReserv" type="submit">
                 </p>

                   <div id="response">
                    </div

            </form>

        </div>

    </div>
</div>

那么，我想写什么更多，在哪里？还需要的是获得此确认文本。我的_includes / js目录中有一个main.js .. 对不起，我现在对js和ajax不太好.. 我很感激你帮助我！谢谢你们！

编辑 - 这是我的一页中另一种形式的作品..但不是我拥有的那种。

BRUSHED.contactForm = function(){
$("#contact-submit").on('click',function() {
    $contact_form = $('#contact-form');

    var fields = $contact_form.serialize();

    $.ajax({
        type: "POST",
        url: "_include/php/contact.php",
        data: fields,
        dataType: 'json',
        success: function(response) {

            if(response.status){
                $('#contact-form input').val('');
                $('#contact-form textarea').val('');
            }

            $('#response').empty().html(response.html);
        }
    });
    return false;
});

}

Answer 1

您可以在提交按钮上使用非常简单的javascript确认框

<p><input value="RESERVEZ" class="submit" id="submitReserv" name="submitReserv" type="submit" onClick="if(!confirm('Thanks for sumbitting this form')){ return false; }">
             </p>

希望这对你有用。

Answer 2

如果您要做的只是在提交成功返回时提供消息，那么您已经有了答案。您可以在$ .ajax（）调用中成功回调所需的一切。这是你应该做你想做的js的简化版本

  $.ajax({
    type: "POST",
    url: //your url here,
    data: fields,
    dataType: 'json',
    success: function(response) {

        $('#reserv-form').parent().append("<div>Thanks for submitting this form</div>")
    }
  });

表单确认消息ajax / jquery

2 个答案: