Page 1 sur 1

Vérification formulaire

Posté : 20 avr. 2007, 17:17
par Dom!
Bonjour,

J'ai un formulaire et je dois vérifier que les champs soient bien remplis.
Voici ce que j'ai fais pour la vérification :
<SCRIPT language="javascript">
function verifForm(formulaire) {
if (document.formulaire.pass.value == document.formulaire.pass2.value)
	{if ((document.formulaire.nom.value == "") || (document.formulaire.prenom.value == "") || (document.formulaire.email.value == "") || (document.formulaire.adresse.value == "") || (document.formulaire.pass.value == ""))
	{alert('Veuillez remplir les champs avec un * - Merci.');}
	else {	adresse = formulaire.email.value;
	var place = adresse.indexOf("@",1);
	var point = adresse.indexOf(".",place+1);
	if ((place > -1)&&(adresse.length >2)&&(point > 1))
		{
		formulaire.submit();
		return(true);
		}
	else
		{
		alert('Entrez une adresse e-mail valide - Merci.');
		return(false);
		}
	}}
else
	{alert('Veuillez re-saisir votre mot de passe - Merci.');}}
</SCRIPT>
et voici mon formulaire :
 <form name="formulaire" action="index.html"></p>
                                <table width="584" border="0">
                                  <tr>
                                    <th width="83" height="20" scope="col">&nbsp;</th>
                                    <th width="160" align="left" class="Style7" scope="col">Qualit&eacute;</th>
                                    <th width="327" align="left" valign="middle" scope="col"><label>
                                    <select name="qualite" class="rechercher" id="qualite">
                                      <option value="" selected="selected">Choisissez</option>
                                      <?php 
						$sqldip = 'select * from tb_titre';
						
   // $nbsql += 1;
	if ($resselectdip = mysql_query($sqldip)) {
         while ($selectdip = mysql_fetch_array($resselectdip))
         {

		 print '<option value="'.$selectdip["id_titre"].'">'.$selectdip["titre"].'</option>';
                                 
         }
    }
?>
                                    </select>
                                    </label></th>
                                  </tr>
                                  <tr>
                                    <th scope="col">&nbsp;</th>
                                    <th align="left" class="backtraitt Style7" scope="col">Nom * </th>
                                    <th align="left" valign="middle" class="backtraitt" scope="col"><label>
                                      <input name="nom" type="text" class="rechercher" id="nom" />
                                    </label></th>
                                  </tr>
                                  <tr>
                                    <th scope="col">&nbsp;</th>
                                    <th align="left" class="backtraitt Style7" scope="col">Pr&eacute;nom * </th>
                                    <th align="left" valign="middle" class="backtraitt" scope="col"><input name="prenom" type="text" class="rechercher" id="prenom" /></th>
                                  </tr>
                                  <tr>
                                    <th scope="col">&nbsp;</th>
                                    <th align="left" class="backtraitt Style7" scope="col">Adresse * </th>
                                    <th align="left" valign="middle" class="backtraitt" scope="col"><label>
                                      <input name="adresse" type="text" class="rechercher" id="adresse" />
                                    </label></th>
                                  </tr>
                                  <tr>
                                    <th scope="col">&nbsp;</th>
                                    <th align="left" class="backtraitt Style7" scope="col">&nbsp;</th>
                                    <th align="left" valign="middle" class="backtraitt" scope="col"><input name="complement" type="text" class="rechercher" id="complement" /></th>
                                  </tr>
                                  <tr>
                                    <th scope="col">&nbsp;</th>
                                    <th align="left" class="backtraitt Style7" scope="col">Code postal * </th>
                                    <th align="left" valign="middle" class="backtraitt" scope="col"><input name="cp" type="text" class="rechercher_cp" id="cp" size="6" maxlength="5" /></th>
                                  </tr>
                                  <tr>
                                    <th scope="col">&nbsp;</th>
                                    <th align="left" class="backtraitt Style7" scope="col">Ville * </th>
                                    <th align="left" valign="middle" class="backtraitt" scope="col"><input name="ville" type="text" class="rechercher" id="ville" /></th>
                                  </tr>
                                  <tr>
                                    <th scope="col">&nbsp;</th>
                                    <th align="left" class="backtraitt Style7" scope="col">T&eacute;l&eacute;phone</th>
                                    <th align="left" valign="middle" class="backtraitt" scope="col"><input name="telephone" type="text" class="rechercher" id="telephone" /></th>
                                  </tr>
                                  <tr>
                                    <th scope="col">&nbsp;</th>
                                    <th align="left" class="backtraitt Style7" scope="col">Email * </th>
                                    <th align="left" valign="middle" class="backtraitt" scope="col"><input name="email" type="text" class="rechercher" id="email" /></th>
                                  </tr>
                                  <tr>
                                    <th scope="col">&nbsp;</th>
                                    <th align="left" class="backtraitt Style7" scope="col">Mot de passe * </th>
                                    <th align="left" valign="middle" class="backtraitt" scope="col"><label>
                                      <input name="pass" type="text" class="rechercher" id="pass" />
                                    </label></th>
                                  </tr>
                                  <tr>
                                    <th scope="col">&nbsp;</th>
                                    <th align="left" class="backtraitt Style7" scope="col">R&eacute;petez le mot de passe * </th>
                                    <th align="left" class="backtraitt Style7" scope="col"><label>
                                      <input name="pass2" type="text" class="rechercher" id="pass2" />
                                    </label></th>
                                  </tr>
                                  <tr>
                                    <th scope="col">&nbsp;</th>
                                    <th colspan="2" align="left" class="backtraitt Style7" scope="col">&nbsp;</th>
                                  </tr>
                                  <tr>
                                    <th scope="col">&nbsp;</th>
                                    <th colspan="2" align="right" class="backtraitt Style7" scope="col"><label>
                                      <input name="Submit" type="submit" class="ok" value="Enregistrement" onClick="verifForm(this.form)">
                                    </label></th>
                                  </tr>
                                </table></form>
Mon probleme :

Quand je click sur le bouton envoyer il vérifie bien les champs mais envoi quoi qu'il arrive le formulaire... comment faire pour stopper l'envoi si un champ est mal remplit ??

merci pour votre aide

Posté : 20 avr. 2007, 17:23
par Cyrano
utilises un évènement "onsubmit" dans ta balise <form>

L'idée, c'est de lancer la validation lorsque tu cliques sur le bouton d'envoi. Pour bloquer l'envoi des données non valides, il faut que ton code de validation retourne "false", sinon, si toutes les données sont correctes, le code doit retourner "true"

À partir de là, tu fais quelque chose du genre :

Code : Tout sélectionner

<form id="monformulaire" method="post" action="mapagedetraitement" onsubmit="return maFonctionDeValidationJS();"> //... etc ...