javascript et formulaire

[origan]

bonjour,

pourriez vous m'indiquer un code en javascript à insérer permettant de vérifier que tous les champs du formulaire sont remplis lors de l'envoi avec message d'erreur " veuillez remplir tous les champs du formulaire"

je vous donne le code actuel de mon formulaire

<form action="mailto:contact@leaderforex.ch" method="post" enctype="text/plain" name="contact" align="center"class="Style47" id="contact">
		 <p align="left">
			 <label for="nom">Nom * :      </label><input type="text" size="20" maxlength="20" name="nom" id="nom" required title="Le nom est requis!" x-moz-errormessage="Le prénom est requis!" /></p>
		 <p align="left">
			 <label for="prénom">Prénom * : </label>
			 <input type="text" size="20" maxlength="20" name="prénom" id="prénom" required title="Le prénom est requis!" x-moz-errormessage="Le prénom est requis!" /></p>
		 <p align="left">
	 <label for="e-mail">E-mail * :    </label><input type="text" size="20" maxlength="40" name="e-mail" id="e-mail" input required title="L'e-mail est requis!" x-moz-errormessage="L'e-mail est requis!" /></p>
		 <p align="left"><label for="e-mail">Tel * :          </label><input type="text" size="20" maxlength="20" name="tel" id="tel" input required title="Le tel est requis!" x-moz-errormessage="Le tel est requis!" /></p>
		 <p align="left">
			<label for="sujet">Sujet * :     </label>
			<input name="sujet" type="text" class="center" id="sujet" size="40" />
		 </p>
		 <p align="left">
		 <label for="message">Message * :     </label>
		 <br /><br />		
			                  
			<textarea name="message" cols="40" rows="6" id="message" value="Message"></textarea>
		 </p>

		 <p align="center"> </p>
		 <p align="center">
			<input type="submit" value="Envoyer" />
			 </p>
		</form>

en vous remerciant

[origan]

j'ai essayé avec ce code pour le formulaire et le javascript (je connais pas php) et ça marche seulement pour les deux premiers champs, lorsqu'ils ne sont pas remplis par l'utilisateur il y a un message d'erreur donc ça fonctionne.

mais ensuite pour les autres champs s'ils ne sont pas remplis ça ne fonctionne pas il n'y a plus de message d'erreur je ne comprends pas pourquoi pourriez vous m'aider

<form action="mailto:" onsubmit="return check()" method="post" enctype="text/plain" name="contact" align="center"class="Style47" id="contact">
		  <p align="left">
		  <label for="nom">Nom * :      </label><input type="text" size="20" maxlength="20" name="nom" id="nom" /></p>
		  <p align="left">
			 <label for="prénom">Prénom * : </label>
			 <input type="text" size="20" maxlength="20" name="prénom" id="prénom" /></p>
		  <p align="left">
	   <label for="e-mail">E-mail * :    </label><input type="text" size="20" maxlength="40" name="e-mail" id="e-mail" /></p>
		  <p align="left"><label for="e-mail">Tel * :          </label><input type="text" size="20" maxlength="20" name="tel" id="tel" ></p>
		  <p align="left">
			<label for="sujet">Sujet * :     </label>
			<input name="sujet" type="text" class="center" id="sujet" size="40" />
		  </p>
		  <p align="left">
		 <label for="message">Message * :     </label>
		 <br /><br />		
			                  
			<textarea name="message" cols="40" rows="6" id="message" value="Message" ></textarea>
		  </p>

		  <p align="center"> </p>
		  <p align="center">
			<input type="submit" value="Envoyer" />
			 </p>
		</form>
		<script type=text/javascript>
function check() {
  if (document.contact.nom.value == '') {
	alert('Veuillez remplir tous les champs du formulaire');
	return false;
  }
  if (document.contact.prénom.value == '') {
	alert('Veuillez remplir tous les champs du formulaire');
	return false;
  }
  if (document.contact.e-mail.value == '') {
	alert('Veuillez remplir tous les champs du formulaire');
	return false;
  }
  if (document.contact.tel.value == '') {
	alert('Veuillez remplir tous les champs du formulaire');
	return false;
  }
  if (document.contact.sujet.value == '') {
	alert('Veuillez remplir tous les champs du formulaire');
	return false;
  }
  if (document.contact.message.value == '') {
	alert('Veuillez remplir tous les champs du formulaire');
	return false;
  }
  return true;
  }
</script>

en vous remerciant

[SStephane]

if (document.contact.e-mail.value == '')

ne peut pas fonctionner à cause du tiret, essaie ceci à la place :

if (document.contact["e-mail"].value == '')

D'ailleurs, même si ça fonctionne, par convention, évite les accents/tirets dans les name/id, c'est pas tiptop. Il vaut mieux se contenter de caractères alphanumériques sans accents et d'_.

[origan]

super c'est exactement cela maintenant ça fonctionne pour tous les champs

est ce que tu penses que ça pose probleme que l'action soit "mailto:" plutot que "page.php"

c'est seulement un formulaire de contact pour me contacter par e-mail donc je n'ai pas besoin d'avoir une base de données qui recueil des infos sur les internautes

je te remercie

Modifié 1 Octobre 2012 par origan

[SStephane]

ça ne pose pas de souci, mais c'est à toi de voir car ton adresse peut être spammée à terme, tu n'as pas non plus besoin de stocker dans une base de données ce que tu reçois via php.

Le hub a écrit un article il y a quelques années, adapte le éventuellement à tes besoins : http://www.webmaster-hub.com/publication/Un-Mailer-pour-votre-site-web.html

[Dadou]

Si, ça pose un gros soucis pour tout tes visiteurs qui utilisent des webmail plutôt qu'un client de messagerie

[origan]

lorsqu'on fait un formulaire avec action : "page.php" doit on enregistrer le page du formulaire en .php ou peut on la garder en .html (je ne connais pas le php).

apparemment le formulaire avec action mailto: peut être spammé en même temps la plupart des e-mails sont spammés donc quel est l'inconvénient d'avoir un e-mail spammé paie t on quelque chose de plus auprés de l'hébergeur.

[Ernestine]

Bonjour,

Si tu veux enregistrer les données du formulaire de mail (ce qui peut-être une sécurité, au cas où pour une raison ou pour une autre le mail ne parvenait pas à destination), alors tu dois impérativement utiliser php ou un autre langage côté serveur, mais HTML ne peut bien sûr rien enregistrer.

L'avantage du traitement côté serveur (pour enregistrer le mail et/ou pour l'expédier) est qu'il permet d'éviter d'inclure l'adresse email avec un mailto: dans le code html. Ok, toutes les adresses e-mails finissent par être spammées un jour ou l'autre, mais il ne faut pas tendre le bâton pour se faire battre, et limiter les dégâts dans la mesure du possible.

Reste un compromis : obfusquer ton adresse email dans le code html, en l'incluant avec une fonction php qui l'encrypte, puis, côté client, une fonction javascript qui va la décrypter en sens inverse (exemple : encodage/décodage en base64). Ainsi elle sera pleinement utilisable, mais restera cryptée dans le html.