Question

我的一页联系表格有问题。

当我单击“提交”按钮时，我将运行JavaScript检查以查看是否填写了这些字段。

该检查工作正常，但我不知道为什么PHP没有响应。

我不能使用另一个php页面进行处理，因为我想将相同的联系页面用于其他联系目的。

这是我想要的顺序：

 1. Form gets filled in
 2. On click of the submit butten, javascript checks the fields.
 3. If okay, javascript submits the form
 4. if mail has been sent, the page is reloaded to  contact.php?MailStatus=Success
 5. if not (it will run a javascript giving en errormessage telling the user to retry without the fields being cleared.

contact.php（代码）

<!DOCTYPE html>

<html>
<head>
    <title>Mijn Dier En Ik</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="author" content="www.csl-tech.be" />
    <meta name="description" content="Op zoek naar dierenhotels, artsen, winkels,... Dan is Mijn Huisdier en Ik de website die je zoekt. Neem een kijkje!" />
    <link rel="stylesheet" type="text/css" href="CSLCSS.css">
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="functions.js"></script>
</head>

<body>

<div class="container csl-main">
        <div class="row">
<div class="col-md-6">
                <form id="MailForm" method="post">
                    <div id="Message"></div>

                    <div id="FormFields">
                    <div class="form-group">
                        <label for="fname">Voornaam</label>
                        <input class="form-control" type="text" id="fname" placeholder="Uw voornaam...">
                    </div>
                    <br />
                    <div class="form-group">
                        <label for="lname">Achternaam</label>
                        <input class="form-control" type="text" id="lname" placeholder="Uw achternaam...">
                    </div>
                    <br />
                    <div class="form-group">
                        <label for="email">E-mail</label>
                        <input class="form-control" type="text" id="email" placeholder="Uw e-mail...">
                    </div>
                    <br />
                    <div class="form-group">
                        <label for="country">Land</label>
                        <select class="form-control" id="country" name="country">
                            <option value="Belgie">België</option>
                            <option value="Nederland">Nederland</option>
                        </select>
                    </div>
                    <br />
                    <div class="form-group">
                        <label for="subject">Onderwerp</label>
                        <select class="form-control" id="subject" name="subject">
                            <option value="Vragen">Vragen over Mijn Dier en Ik</option>
                            <option value="Suggesties">Suggesties voor de website</option>
                            <option value="Reservatie of Contact">Vragen over het reservatie- en/of contactsysteem</option>
                            <option value="Foto inzending">Foto inzenden</option>
                            <option value="Aanpassing gegevens">Aanpassing gegevens</option>
                            <option value="Andere">Andere</option>
                        </select>
                    </div>
                    <br />
                    <div class="form-group">
                        <label for="message">Uw bericht</label>
                        <textarea class="form-control" id="message" placeholder="Typ hier uw bericht..." style="height:200px"></textarea>
                    </div>
                    <br />

                    <input id="submit" class="btn btn-default" value="Versturen" onclick="CheckMailEntry()">
                    </div>
                </form>
            </div>
        </div>
    </div>

</body>

<?php
    if ($_GET['MailStatus'] == 'Success') {
        echo '<script type="text/javascript">MailSuccess()</script>';
    }


    if(isset($_POST['submit'])) {
        header('Location: contact.php?MailStatus=Success');
        echo 'ok';
    }
?>


</html>

JavaScript代码：

function CheckMailEntry() {

    document.getElementById("Message").innerHTML = "";
    if (document.getElementById("fname").value == "") {
        document.getElementById("Message").innerHTML = "<div class='alert alert-danger'><strong>Fout:</strong> Voer uw voornaam in.</div>";
    } else if (document.getElementById("lname").value == "") {
        document.getElementById("Message").innerHTML = "<div class='alert alert-danger'><strong>Fout:</strong> Voer uw achternaam in.</div>";
    } else if (document.getElementById("email").value == "") {
        document.getElementById("Message").innerHTML = "<div class='alert alert-danger'><strong>Fout:</strong> Voer uw email in.</div>";
    } else if (document.getElementById("message").value == "") {
        document.getElementById("Message").innerHTML = "<div class='alert alert-danger'><strong>Fout:</strong> Gelieve een bericht te typen.</div>";
    } else {
        document.getElementById("Message").innerHTML = "";
        document.getElementById("submit").submit();
    };

};



function MailSuccess() {
    document.getElementById("Message").innerHTML = "<div class='alert alert-success'><strong>Succes:</strong> Wij hebben uw mail ontvangen en zullen deze zo snel mogelijk beantwoorden.</div>";
    document.getElementById("FormFields").innerHTML = "";
};

带有JAvascript验证的php邮件格式

0 个答案: