Bonjour à tous j'ai un formulaire de contact dans lequel les champs vides ou incorrect ressortent en rouge, mon problème est que je ne sais pas comment y inclure un label (celui-ci ayant une valeur par défaut).
Est-ce que quelqu'un aurait une piste ou une réponse à me fournir?
voici mon code PHP :
et mon css :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79 <?php if (!empty($_POST)) { extract($_POST); $valid=true; $valid = (empty($nom) || empty($pays) || empty($email) || !filter_var($email,FILTER_VALIDATE_EMAIL) || empty($message)) ? false : true; $erreurNom = (empty($nom)) ? 'Indiquer votre nom' : NULL; $erreurPays = (empty($pays)) ? 'Indiquer votre pays' : NULL; $erreurEmail = (empty($email) || !filter_var($email,FILTER_VALIDATE_EMAIL)) ? 'Indiquer un Email valide' : NULL; $erreurMessage = (empty($message)) ? 'Indiquer votre message' : NULL; if ($valid) { $nom = strip_tags($nom); $pays = strip_tags($pays); $email = strip_tags($email); $message = strip_tags($message); } } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title></title> <link rel="stylesheet" media="screen" href="ecran.css" /> </head> <body> <div id="content"> <form method="post" action="index.php"> <?php if (isset($erreurNom)): ?> <label for="nom" class="error"><?php if (isset($erreurNom)) echo $erreurNom; ?> :</label> <input type="text" class="error" name="nom" value="<?php if(isset($nom)) echo $nom; ?>"/> <?php else :?> <label for="nom">Nom :</label> <input type="text" name="nom" value="<?php if(isset($nom)) echo $nom; ?>"/> <?php endif ;?> <?php if (isset($erreurPays)): ?> <label for="pays" class="error"><?php if (isset($erreurPays)) echo $erreurPays; ?></label> <select name="pays" class="error" value="<?php if(isset($pays)) echo $pays; ?>"> <option value="Choix 1"><option value="Choix 2">Choix 2 <option value="Choix 3">Choix 3 </select> <?php else :?> <label for="pays">Pays :</label> <select name="pays" value="<?php if(isset($pays)) echo $pays; ?>""> <option value="Choix 1"> <option value="Choix 2">Choix 2 <option value="Choix 3">Choix 3 </select> <?php endif ;?> <?php if (isset($erreurEmail)): ?> <label for="email" class="error"><?php if (isset($erreurEmail)) echo $erreurEmail; ?> : </label> <input type="text" class="error" name="email" value="<?php if(isset ($email)) echo $email; ?>"/> <?php else :?> <label for="email">E-mail :</label> <input type="text" name="email" value="<?php if(isset ($email)) echo $email; ?>"/> <?php endif ;?> <?php if(isset($erreurMessage)):?> <label for="message" class="error"><?php if(isset($erreurMessage)) echo $erreurMessage; ?>:</label> <textarea name="message" class="error" value="<?php if (isset($message)) echo $message; ?>"></textarea> <?php else :?> <label for="message">Message :</label> <textarea name="message" value="<?php if (isset($message)) echo $message; ?>"></textarea> <?php endif ;?> <input type="submit" value="Envoyer"/> </form> </div> </body> </html>
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81 body { background-color : #F1F1F1; } #content{ background-color : #FFF; margin-left : auto; margin-right : auto; margin-top : 200px; width : 50%; border : solid #A1A1A1 1px; padding : 50px; } label{ display : block ; font-size : 1.2em } label.error{ display : block ; font-size : 1.2em; color : red; } input[type=text]{ padding : 5px; width : 300px; heigth : 20px; border : solid #A1A1A1 1px; margin-bottom : 15px; } input[type=text].error{ padding : 5px; width : 300px; heigth : 20px; margin-bottom : 15px; border : solid #FF7575 1px; -moz-box-shadow : 0 0 20px #F55 inset; -webkit-box-shadow : 0 0 20px #F55 inset; } textarea{ padding : 5px; width : 500px; height : 300px; border : solid #A1A1A1 1px; } textarea.error{ padding : 5px; width : 500px; height : 300px; border : solid #FF7575 1px; -moz-box-shadow : 0 0 20px #F55 inset; -webkit-box-shadow : 0 0 20px #F55 inset; } select{ padding :5px; width : 300px; height : 30px; margin-bottom :15px; border : solid #A1A1A1 1px; } select.error{ padding :5px; width : 300px; height : 30px; margin-bottom :15px; border : solid #FF7575 1px; -moz-box-shadow : 0 0 20px #F55 inset; -webkit-box-shadow : 0 0 20px #F55 inset; } input[type=submit]{ display : block; margin-top : 10px; width : 85px; height : 25px; border : solid #222 1px; background : #333; color : #FFF; -moz-border-radius:5px; -webkit-border-radius:5px; }
Partager