Untitled

<?php

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
        $isValid = true;
    if (!isset($_POST['user_name']) || empty($_POST['user_name'])) {
        $nameError = "Please enter your name";
        $isValid = false;
    }
    if (!isset($_POST['user_email']) || empty($_POST['user_email'])) {
        $emailError = "Please enter your email";
        $isValid = true;
    }elseif (!filter_var($_POST['user_email'],FILTER_VALIDATE_EMAIL)){
        $emailError = "Please enter valid email";
        $isValid = false;
    }

    if (!isset($_POST['tel']) || empty($_POST['tel'])) {
        $numberError = "Please enter your number";
        $isValid = false;
    }
    if (!isset($_POST['user_message']) || empty($_POST['user_message'])) {
        $messageError = "Pleaserequired enter your message";
        $isValid = false;
    }
    if($isValid){
        header ("location:success.php");
    }

}

?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<form  action="form.php"  method="post">
    <div>
        <label  for="nom">Nom :</label>
        <input  type="text"  id="nom"  name="user_name" class="forl-control" >
        <?php if (isset($nameError)) echo $nameError ?>
    </div>
    <div>
        <label  for="courriel">Courriel :</label>
        <input  type="email"  id="courriel"  name="user_email" required>
        <?php if (isset($emailError)) echo $emailError ?>
    </div>
    <div>
        <label  for="message">Message :</label>
        <textarea id="message" name="user_message" required></textarea>
        <?php if (isset($messageError)) echo $messageError ?>
    </div>
    <label for="tel"> Téléphone : </label>
    <input type="tel" id="tel" name="tel" pattern="[0-9]{10}"required>
        <?php if (isset($numberError)) echo $numberError?>
    <label>
        <select name="jour" size="1">
            <option value="monday">lundi
            <option value="tuesday"> mardi
            <option value="wednesday"> mercredi
            <option value="thursday"> jeudi
            <option value="friday"> vendredi
        </select>
    </label>
    <select name="partie_de_la_journee" size="1">
        <option value="morning"> matin
        <option value="afternoon"> apr&egrave;s-midi
        <option value="night"> soir
    </select>
    </div>
    <div  class="button">
        <button  type="submit">Envoyer votre message</button>
    </div>
</form>
<style>
    form {
        /* Uniquement centrer le formulaire sur la page */
        margin: 0 auto;
        width: 400px;
        /* Encadré pour voir les limites du formulaire */
        padding: 1em;
        border: 1px solid #CCC;
        border-radius: 1em;
    }

    form div + div {
        margin-top: 1em;
    }

    label {
        /* Pour être sûrs que toutes les étiquettes ont même taille et sont correctement alignées */
        display: inline-block;
        width: 90px;
        text-align: right;
    }

    input, textarea {
        /* Pour s'assurer que tous les champs texte ont la même police.
           Par défaut, les textarea ont une police monospace */
        font: 1em sans-serif;

        /* Pour que tous les champs texte aient la même dimension */
        width: 300px;
        box-sizing: border-box;

        /* Pour harmoniser le look & feel des bordures des champs texte */
        border: 1px solid #999;
        margin-bottom: 10px;
    }

    input:focus, textarea:focus {
        /* Pour souligner légèrement les éléments actifs */
        border-color: #000;
    }

    select {
        text-align:  center;
    }

    textarea {
        /* Pour aligner les champs texte multi‑ligne avec leur étiquette */
        vertical-align: top;

        /* Pour donner assez de place pour écrire du texte */
        height: 5em;
    }

    .button {
        /* Pour placer le bouton à la même position que les champs texte */
        padding-left: 90px; /* même taille que les étiquettes */
    }

    button {
        /* Cette marge supplémentaire représente grosso modo le même espace que celui
           entre les étiquettes et les champs texte */
        margin-left: .5em;
    }
</style>


</body>
</html>