11550 sujets

JavaScript, DOM et API Web HTML5

Problème vérification formulaire

Bonjour,

J'ai un problème pour une vérification d'email dans un formulaire. J'arrive a vérifié si l'email est bien formaté (affiche erreur) mais je n'arrive pas afficher si il n'y a pas d'erreur.

En gros il m'affiche toujours une erreur comme quoi l'email est mal formater (bordure rouge)

Mon javascript:

 // Formulaire de contact
      function envoyer(){
         var nom = document.getElementById('nom');
         var prenom = document.getElementById('prenom');
         var sujet = document.getElementById('sujet');
         var email = document.getElementById('email');
         var comm = document.getElementById('comm');    
         
         if(nom.value.length >= 2 && prenom.value.length >=2 && sujet.value.length >=2 && email.value.length >=2 && isMail(email)  && comm.value.length >=2){
            return true;
         }
         else{
            if(nom.value.length < 2){
               nom.style.border = '1px solid red';
            }
            else{
               nom.style.border = '1px solid #333';
            }            
            if(prenom.value.length < 2){
               prenom.style.border = '1px solid red';
            }
            else{
               prenom.style.border = '1px solid black';
            }
            if(sujet.value.length < 2){
               sujet.style.border = '1px solid red';
            }
            else{
               sujet.style.border = '1px solid black';
            }   
            if(email.value.length < 2 || !isMail(email)){
               email.style.border = '1px solid red';
            }
            else{
               email.style.border = '1px solid black';
            }
            if(comm.value.length < 2){
               comm.style.border = '1px solid red';
            }
            else{
               comm.style.border = '1px solid black';
            }  
            return false;
         }
      }
      // Permet de retirer les espaces.
String.prototype.trim = function() {
	// Voir Regexp => En gros, va remplacer tout les caractère non voulus (blancs et autres par "rien du tout").
    return this.replace(/^\s*|\s*$/g, "");
};                                              
// supprime les espaces de début et de fin de chaîne
function TxtTrim(txt){
    return txt.replace(/^\s+/, "").replace(/\s+$/, "");
};
function SupprEspaces(objet){
     objet.value= TxtTrim(objet.value);
};

// Vérifie si la valeur est bien email formaté correctement.
function isMail(email) {
    return (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(email));
};


mon formulaire: 

  echo '<div id="form_contact_left">'; 
  echo '<form method="post" action="includes/traitement_mail.php" id="formulaire" onsubmit="return envoyer();"> 
        <fieldset class="fieldset_coordo"> 		
  		  <table class="formulaire_contact">
          <tr>
          <tr>
            <td><label>Nom:</label></td>
      		  <td><input type="text" name="nom" id="nom"  onChange="SupprEspaces(this);" size="40" style="margin-left: 30px;" />		            
            </td>
      		</tr> 
          <tr>
            <td><label>Pr&eacute;nom:</label></td>
      		  <td><input type="text" name="prenom" id="prenom"  onChange="SupprEspaces(this);" size="40" style="margin-left: 30px;" />
            </td>
      		</tr> 
  		    <tr>
  		    <td>
  		      <label>Sujet:</label>
  		    </td>
  		    <td>
  		      <input type="text" name="sujet" id="sujet"  onChange="SupprEspaces(this);" size="40" style="margin-left: 30px;" />
  		    </td>
  		    </tr>
  		    <tr>
  		    <td>
  		      <label>E-mail:</label>
  		    </td>
  		    <td>
  		      <input type="text" name="email" id="email" onChange="SupprEspaces(this);"  size="40" style="margin-left: 30px;" />
  		    </td>
  		    </tr>
  		    <tr>
  		    <td>
  		      <label>Destinataire:</label>
  		    </td>
  		    <td>
  
  		  <select name="destinataire" style="margin-left:30px; width:255px;">
  			   <option value="0">-------------------------------------------------------</option>';  		  
  		  $query = "SELECT * FROM t_support ORDER BY niveauSupport";
  		  $result = mysql_query($query);
  		  while($row = mysql_fetch_array($result)){
  			   echo('<option value="'.$row['mailSupport'].'">'.$row['niveauSupport'].'</option>');
  		  }           		 		
  echo '</select>    
  		  </td>
  		  </tr>
  		  <tr>
  		  <td>
  		    <label>Message:</label>
  		  </td>
  		  <td>
  		    <textarea name="comm" id="comm" cols="40"  onChange="SupprEspaces(this);" rows="10" style="margin-left:30px; width:250px;"></textarea>
  		  </td>
  		  </tr>
  		  <tr>
  		  <td>
  		  </td>
  		  <td>
  		    <input type="submit" name="enregistrer" id="enregistrer" value="Envoyer"  style="margin-left:30px;"  />
  		    <input type="reset" id="reset" id="reset" value="Annuler" />
  		  </td>
  		  </tr>
  		  </table>
  		  <p class="verif_form">Tous les champs du formulaire sont obligatoires</p>
  		  </fieldset> 	
  		</form>';    // Fermeture Formulaire
  echo '</div>';



Je pense que l'erreur provient de cette ligne ci mais je n'arrive pas a la régler

         if(nom.value.length >= 2 && prenom.value.length >=2 && sujet.value.length >=2 && email.value.length >=2 && isMail(email)  && comm.value.length >=2){
            return true;
         }
Bonjour,

vu le code, je pense que tu dois sûrement passer email.value et non email à ta fonction isMail().
Salut Neko,

Je viens de tester ça ne fonctionne pas ou alors je m'y prend mal.

J'ai vraiment l'impression que l'erreur vient de cette ligne mais je n'arrive pas a trouver ou. j'ai testé tout sans la vérification du formatage de l'email et sa fonctionne

if(nom.value.length >= 2 && prenom.value.length >=2 && sujet.value.length >=2 && email.value.length >=2 && isMail(email)  && comm.value.length >=2){ 
            return true; 
         }
Bonjour,

Quand tu dis que ça ne fonctionne pas, c'est que tu as encore le champ email avec la bordure?

Si oui remplace :

if(nom.value.length >= 2 && prenom.value.length >=2 && sujet.value.length >=2 && email.value.length >=2 && isMail(email)  && comm.value.length >=2){  
            return true;  
         }

par


if(nom.value.length >= 2 && prenom.value.length >=2 && sujet.value.length >=2 && email.value.length >=2 && isMail(email.value)  && comm.value.length >=2){  
            return true;  
         }


et 

   
            if(email.value.length < 2 || !isMail(email)){ 
               email.style.border = '1px solid red'; 
            }

par 

   
            if(email.value.length < 2 || !isMail(email.value)){ 
               email.style.border = '1px solid red'; 
            }
Sujet clos
Aller à