Validation de champs

**polaroid62** · 04/02/2014, 18h28

http://jsfiddle.net/exPah/ Voilà mon problème j'ai un script Jquery chargé de vérifier les champs du formulaire et de les colorer syntaxiquement si ils ne sont pas remplis. il fonctionne sauf quand j'inclue le hautdepage.php dont le code se trouve plus bas sur Jsfiddle. Au lieu de ça je vois qu'il me colore au dessus de la bannière car un peu de rouge dépasse. Quand je vire la bannière ça passe. Quelqu'un comprend-t-il ce qui se passe et ce qu'il y a à corriger

On travaille en groupe et mon script marchait jusqu'à présent , je ne vois pas ce qui peut foutre du boxon.

**danielhagnoul** · 04/02/2014, 20h59

Bonsoir

Un fichier serveur est inutile (il faut le code source affiché par le navigateur). L'ajout de code par un include() PHP avec un chemin relatif.ne fonctionne pas en dehors de votre serveur.

Je vous conseille de changer l'événement "mouseover" (générateur de problèmes) pour un "mouseenter".

**polaroid62** · 04/02/2014, 21h43

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
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
 
 
<!doctype html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>Touristas</title>
		<link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />		
 
	</head>
	<body>
 
		<header>
			<div id="bandeau">
				<div id="logo"><a href="index.php"><img src="images/logo.png"></img></a></div>
				<div id="login">
								<form name='connexion' method='post' action='/touristas/question.php' >
					<table width="700">
					  <tr>
						<td align="center" id="message" colspan="4"></td>
					  </tr>
					  <tr>
						<td>E-Mail </td>
						<td><input type="text"  id="mail" name="mail" value="" size="10" maxlength="40" /></td>
						<td>Mot de passe</td>
						<td><input type="password"  id="pass" name="pass" value="" size="10" maxlength="20" /></td>
						<td><input type="checkbox" name=" value="1" />Mémoriser</input></td>
						<td><input type="submit" id="bouton" name="connexion" value="Envoyer"></td>
						<td align="center">&nbsp;&nbsp;<a href="mot-de-passe-oublie.php" title="Cliquez ici si vous ne vous souvenez pas de votre mot de passe">Mot de passe oublié ?</a><br> <a href="creation-de-compte.php" title="Création de compte" >Création de compte</a></td>
					  </tr>
					</table>
				</form>
								</div>
			</div>
			<div id="menu">
			<ul>
				<li><a href="index.php">Accueil</a>
				</li>
				<li><a href="destinations.php"> Destinations </a>
				</li>
				<li><a href="nosautocars.php"> Qui sommes-nous </a>
					<ul>
						<li><a href="nosautocars.php"> Nos Autocars</a></li>
						<li><a href="noussituer.php"> Nous situer</a></li>
					</ul>
				</li>
				<li><a href="reservations.php"> Réservations </a>
				</li>
				<li><a href="question.php"> Contact </a>
					<ul>
						<li><a href="question.php"> Poser une question</a></li>
						<li><a href="avis.php"> Donner votre avis</a></li>
					</ul>
				</li>
			</ul>
			</div>
		</header>
 
			<div id="contenu">	
 
<!-- Nous chargeons le framework Jquery  et notre script de validation --> 
 
 
 <script  src="js/jquery.js"></script>     
 <script src="js/validation.js"></script>
 <script type="text/javascript">
  function transcribe(words) {
    document.getElementById("speech").value = words;
    document.getElementById("micro").value = "";
    document.getElementById("speech").focus();
  }
</script>
 
 
 
 
 
 
 
 
 
 
 
 
 
	<body>
		<form method="post"   id ="monForm"  action="contact.php"  >
 
			<h1>Poser une question</h1>
		<div id='cadrecontent'>	
			Pour vos questions d’ordre général sur Touristas, son offre, son activité, nous mettons à votre disposition un formulaire de contact:<br>
			<br>
		<table>
			<tr><td><label for="nom">Nom*</label></td> <td><input id="nom" x-webkit-speech="x-webkit-speech" type="text" name="nom" size="40"></td></tr>
			<tr><td><label for="prenom">Prénom*</label></td> <td><input id="prenom" x-webkit-speech="x-webkit-speech" type="text" name="prenom" size="40"></td></tr>
 
			<tr><td><label for="adresse">Adresse</label></td> <td><input id="adresse" x-webkit-speech="x-webkit-speech" type="text" name="adresse" size="40"></td></tr>
			<tr><td></td> <td><input id="adresse" x-webkit-speech="x-webkit-speech" type="text" name="adresse" size="40"></td></tr>
 
			<tr><td><label for="CP">Code Postal</label></td> <td><input id="CP" x-webkit-speech="x-webkit-speech" type="text" name="CP" size="40"></td></tr>
			<tr><td><label for="ville">Ville</label></td> <td><input id="ville" x-webkit-speech="x-webkit-speech" type="text" name="ville" size="40"></td></tr>
			<tr><td><label for="pays">Pays</label></td> <td><input id="pays" x-webkit-speech="x-webkit-speech" type="text" name="pays" size="40"></td></tr>
 
			<tr><td><label for="mail">E-mail*</label></td> <td><input id="email"x-webkit-speech="x-webkit-speech" type="text" name="mail" size="40"></td></tr>
			<tr><td><label for="tel">Téléphone</label></td> <td><input id="tel" x-webkit-speech="x-webkit-speech" type="text" name="tel" size="40"></td></tr>
 
			<tr><td><label for="message">Message<br>
			(pour toutes questions <br>
			relatives à votre voyage,<br>
			veuillez préciser votre n° de dossier<br>
			ou n° de billet)*</label></td>
			<td><textarea id="speech" value="message" name="message" rows=5 cols=40 placeholder="Votre message..."></textarea>
            <input style="width:15px;height:20px;border:0px;bacground-color:transparent;"
  id="mic" onwebkitspeechchange="transcribe(this.value)" x-webkit-speech></td>
			</tr>
		</table>
 
		<br>
			<input type="checkbox" name="recevoir" value="offre" checked>Je souhaite recevoir les offres de Touristas par E-mail
		<br>
		<br>
 
		<input type="reset" id="bouton" value="Annuler">
		<input type="submit" id="bouton" name="image-valider" value="Envoyer" id="envoi" height="20px" ;>
 
		</form>
		</div>
	</body>
   			</div>
 
		<footer>
 
				<div id="textefooter">
					<a href="admin.php" title="Administration">Administration</a>&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;
					<a href="conditionsvente.php" title="Conditions de vente">Conditions de vente</a>
					&nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;  
					<a href="mentionslegales.php" title="Mentions Légales">Mentions Légales</a>
					 &nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;  
					<a href="contactwebmaster.php" title="Contactez le webmaster">Webmaster</a>
					&nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;  © Touristas-2014
				</div>
			<div id="reseauxsociaux">
				<a href="http://facebook.com"><div id="imagefacebook"></div></a>
				<a href="http://twitter.com"><div id="imagetwitter"></div></a>
				<a href="http://google.com"><div id="imagegoogle"></div></a>
			</div>
		</footer>
 
	</body>
</html>
</html>

Le voici

**danielhagnoul** · 04/02/2014, 22h34

Structure de la page web !

Table sans "tbody"
<body> aux lignes 11 et 86 (il ne doit y en avoir qu'un seul)
</body> aux lignes 128 et 149
Une division <div id="contenu"> qui commence dans un "body" (ligne 59) et se termine dans l'autre (ligne 129)

**polaroid62** · 05/02/2014, 06h12

J'ai viré ce que tu as dis et ça ne change rien à mon problème. j'ai mis une video pour avoir visuel.

Bon je viens de trouver la cause du bordel et pourtant c'est la première erreur à laquelle j'ai pensé: deux id identiques que je n'ai pas vu

Bon maintenant le script n'inscrit plus rien dans le champs message alors qu'il marchait auparavant sans hautdepage

Bon j'ai résolu le problème mais je dois virer la reconnaissance vocale du textarea ce qui n'est pas bien grave vu que seul Chrome le supporte.