Last active
April 1, 2020 00:16
-
-
Save pierrealexaline/e1e626f47cef50ddb93794163f9d8c9d to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/* | |
Le formulaire de contact comporte les champs : | |
----------------------------------------------- | |
nom, | |
prénom, | |
e-mail, | |
téléphone, | |
sujet (sous forme de liste déroulante) | |
message (textarea). | |
Côté PHP : | |
---------------------------------------------- | |
Tous les champs sont requis et ne doivent pas être vides; | |
Le format du champ e-mail est vérifié, | |
à l'aide de filter_var. | |
Côté client / front : | |
--------------------------------------------- | |
Tous les champs sont requis; | |
la validité du champ e-mail est vérifiée et correspond au format attendu (filter_var). | |
Occupes toi dans un premier temps de la partie serveur, | |
ensuite tu pourras passer à la partie client. | |
*/ | |
// define and set variables to empty values | |
$name = $surname = $email = $phone = $subject = $message = ""; | |
$error = ""; | |
function test_input($data) { | |
$data = trim($data); | |
$data = stripslashes($data); | |
$data = htmlspecialchars($data); | |
return $data; | |
} | |
if ($_SERVER["REQUEST_METHOD"] == "POST") { | |
// Is isset ? | |
if( isset($_POST["user_name"]) ){ | |
$name = test_input($_POST["user_name"]); | |
} else { | |
$name = ""; | |
} | |
if( isset($_POST["user_surname"]) ){ | |
$surname = test_input($_POST["user_surname"]); | |
} else { | |
$surname = ""; | |
} | |
if( isset($_POST["user_mail"]) ){ | |
$email = test_input($_POST["user_mail"]); | |
} else { | |
$email = ""; | |
} | |
if( isset($_POST["user_phone"]) ){ | |
$phone = test_input($_POST["user_phone"]); | |
} else { | |
$phone = ""; | |
} | |
if( isset($_POST["subject"]) ){ | |
$subject = test_input($_POST["subject"]); | |
} else { | |
$subject = ""; | |
} | |
if( isset($_POST["user_message"]) ){ | |
$message = test_input($_POST["user_message"]); | |
} else { | |
$message = ""; | |
} | |
//Is empty ... | |
if (empty($name)) { | |
$error .= "Name is required !<br>\n"; | |
} | |
if (empty($surname)) { | |
$error .= "Surname is required !<br>\n"; | |
} | |
if (empty($email)) { | |
$error .= "Email is required !<br>\n"; | |
} | |
if (empty($phone)) { | |
$error .= "Phone is required !<br>\n"; | |
} | |
if (empty($subject)) { | |
$error .= "Subject is required !<br>\n"; | |
} | |
if (empty($message)) { | |
$error .= "Message is required !<br>\n"; | |
} | |
// if no error releved ... | |
if(empty($error)){ | |
// test the mail adress format with filter_var | |
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) { | |
$error .= "Invalid email format !<br>\n"; | |
} | |
// test phone numeric and equal to 10 | |
if ( !is_numeric($phone) || strlen($phone)!=10) { | |
$error .= "Phone format 10 numbers !<br>\n"; | |
} | |
// test message strlen | |
if ( strlen($message) > 500) { | |
$error .= "Message max 500 characters !<br>\n"; | |
} | |
// if no error releved ... | |
if(empty($error)){ | |
echo "Merci " . $surname . " " . $name . " de nous avoir contacté à propos de " . $subject . ". | |
Un de nos conseiller vous contactera soit à l’adresse " . $mail . " ou par téléphone au " . $phone . " | |
dans les plus brefs délais pour traiter votre demande : " . $message . "<br>\n"; | |
exit("...end script !<br>\n"); | |
} else { | |
echo $error; | |
exit("...end script !<br>\n"); | |
} | |
} else { | |
echo $error; | |
exit("...end script !<br>\n"); | |
} | |
} | |
?> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8" /> | |
<meta http-equiv="x-ua-compatible" content="ie=edge" /> | |
<meta name="viewport" content="width=device-width, initial-scale=1" /> | |
<title>Forms and validation</title> | |
<link rel="stylesheet" href="css/styles.css" /> | |
<link rel="icon" href="images/favicons/favicon.ico" /> | |
<style> | |
h1, h2{ | |
text-align:center; | |
} | |
form { | |
margin: 0 auto; | |
width: 400px; | |
padding: 2em; | |
border: 1px solid #CCC; | |
border-radius: 0.2em; | |
} | |
form div + div { | |
margin-top: 1em; | |
} | |
label { | |
display: inline-block; | |
width: 90px; | |
text-align: right; | |
} | |
input, textarea { | |
font: 1em sans-serif; | |
width: 300px; | |
box-sizing: border-box; | |
border: 1px solid #999; | |
} | |
input:focus, textarea:focus { | |
border-color: #000; | |
} | |
textarea { | |
vertical-align: top; | |
height: 5em; | |
} | |
.button { | |
padding-left: 90px; | |
} | |
button { | |
margin-left: .5em; | |
} | |
</style> | |
</head> | |
<body> | |
<main> | |
<section> | |
<h1>Contact</h1> | |
<article> | |
<h2>Contact form</h2> | |
<form action="http://localhost:8000/thanks.php" method="post"> | |
<div> | |
<label for="name">Name :</label> | |
<input type="text" id="name" name="user_name" placeholder="My name" | |
pattern="^[a-zA-Z'àâäáãåîïìíôöòóõøùûüúéèêëçÿñýÀÂÄÁÃÅÎÏÌÍÔÖÒÓÕØÙÛÜÚÉÈÊËÇŸÑÝ]{1,20}$" required> | |
</div> | |
<div> | |
<label for="surname">Surname :</label> | |
<input type="text" id="surname" name="user_surname" placeholder="My surname" | |
pattern="^[a-zA-Z'àâäáãåîïìíôöòóõøùûüúéèêëçÿñýÀÂÄÁÃÅÎÏÌÍÔÖÒÓÕØÙÛÜÚÉÈÊËÇŸÑÝ]{1,20}$" required> | |
</div> | |
<div> | |
<label for="mail">e-mail :</label> | |
<input type="email" id="mail" name="user_mail" | |
pattern="^([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x22([^\x0d\x22\x5c\x80- | |
\xff]|\x5c[\x00-\x7f])*\x22)(\x2e([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+| | |
\x22([^\x0d\x22\x5c\x80-\xff]|\x5c[\x00-\x7f])*\x22))*\x40([^\x00-\x20\x22\x28\x29\x2c\x2e\x3a-\x3c\x3e | |
\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])*\x5d)(\x2e([^\x00-\x20\x22\x28 | |
\x29\x2c\x2e\x3a-\x3c\x3e\x40\x5b-\x5d\x7f-\xff]+|\x5b([^\x0d\x5b-\x5d\x80-\xff]|\x5c[\x00-\x7f])*\x5d))*$" | |
required> | |
</div> | |
<div> | |
<label for="phone">Phone :</label> | |
<input type="tel" id="phone" name="user_phone" | |
pattern="^(?:0|\(?\+33\)?\s?|0033\s?)[1-79](?:[\.\-\s]?\d\d){4}$" required> | |
</div> | |
<div> | |
<label for="mail">Subject :</label> | |
<select id="subject" name="subject" required autofocus> | |
<option value="info">Get informations</option> | |
<option value="help">Tell for help</option> | |
<option value="bug">Declare a bug</option> | |
</select> | |
</div> | |
<div> | |
<label for="msg">Message :</label> | |
<textarea id="msg" name="user_message" placeholder="Hello world !" maxlength="500" required></textarea> | |
</div> | |
<div class="button"> | |
<button type="submit">Envoyer le message</button> | |
</div> | |
</form> | |
</article> | |
</section> | |
</main> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment