script n'ont pris en compte pour validation email

script n'ont pris en compte pour validation email - HTML/CSS - Programmation

Marsh Posté le 16-01-2006 à 13:57:56    

Salut a toutes et a tous,  
 
bon voila j'ai un petit formulaire et je veux faire une verification de la validité de certains champs sur l'evenement onClick de mon bouton envoyer.
Pour ca j'ai fai un script en javascript dans un fichier externe et quand je fai des test il ne me prend pas en compte l'evenement onClick, pourtant j'ai bien déclarer dans le <head> la presence de mon fichier javascript
voila le code de mon bouton envoyer:
<input type="submit" name="btnEnvoyer" value="Envoyer" onclick="verifFormulaire(this.formulaire);" tabindex="11" align="right" />
 
et voici la déclarartion de ma fonction javascript:
function verifFormulaire(formulaire)
{bla bla bla bla
 
dans mon <form> j'ai mis name="formulaire" donc ca devarit passer normalement mais j'ai rien du tout.....
 
si quelqu'un pouvait m'eclairer


Message édité par bedomon le 17-01-2006 à 11:00:53
mood
Publicité
Posté le 16-01-2006 à 13:57:56  profilanswer
 

n°1284507
omega2
Posté le 16-01-2006 à 14:16:25  profilanswer
 

utilise l'évènement onsubmit de la balise <form>.


Message édité par omega2 le 16-01-2006 à 14:16:43
n°1284508
gatsu35
Blablaté par Harko
Posté le 16-01-2006 à 14:16:39  profilanswer
 

et on pourrait voir le code HTML et Javascript de ta page, parce que ton charabia il ne nous donne rien du tout

n°1284516
bedomon
La vérité est ailleurs
Posté le 16-01-2006 à 14:21:53  profilanswer
 

mouais je me douatis que je ne savais pas m'expliquer
le fichier javascripts:
//fonction de verification du formulaire
function verifFormulaire(formulaire)
{
mail = document.verif.txtMail.value;
 var place = mail.indexOf("@",1);
 var point = mail.indexOf(".",place+1);
 if ((place > -1)&&(mail.length >2)&&(point > 1)&& (formulaire.txtNomSociete.value != "" ) && (formulaire.telSociete.value!="" ) && (formulaire.txtNomContact.value != "" ) && (formulaire.textAreaQuestion.value!="" )&& if(formulaire.menuPays.value=="France"{(formulaire.telSociete.length==10} ) ((formulaire.renseignements.checked !=false) || (formulaire.devis.checked !=false) || (formulaire.rdv.checked !=false))
  {
  document.verif.submit();
  }
 else{
  if (formulaire.txtNomSociete.value == "" ){
   alert('Veuillez saisir le nom de la société');  
           }
  else{
   if (formulaire.telSociete.value=="" ) || (formulaire.telSociete.length !=10){
    alert('Veuillez saisir le numéro de téléphone ');
            }
         else{
    if (formulaire.txtNomContact.value == "" ){
     alert('Veuillez saisir votre nom');
    }
    else{
     if ((formulaire.renseignements.checked==false) || (formulaire.devis.checked==false) || (formulaire.rdv.checked==false)){
      alert('veuillez coché votre type de demande')
     }
          if (formulaire.textAreaQuestion.value == "" ){
       alert('Entrez votre demande, svp !!');
        }
          else{
           alert('Entrez une adresse e-mail valide, svp !!');
        }
                  }
     }
    }
   }
 }
}
 
et ma page web
 
<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="css/styleFormulaire.css" />
<title>Demande de renseignements</title>
<script language="javascript1.5" src="scripts/verif_formulaire.js"></script>
</head>
 
<body>
<form id="form1" name="formulaire" method="post" action="traitement_formulaire.asp">
 <p>
 <fieldset>
 
BLABLABLABLABLABALBlaBLABLABLABLABLABALBlaBLABLABLABLABLAB
ALBlaBLABLABLABLABLABALBlaBLABLABLABLABLABALBlaBLABLABLABLA
BLABALBlaBLABLABLABLABLABALBla
 
 
 </fieldset>
    <div class="formlabel">&nbsp; </div>
 
 <input type="submit" name="btnEnvoyer" value="Envoyer" onclick="verifFormulaire(this.form);" tabindex="11" align="right" />
   
 </p>
</form>

Reply

Marsh Posté le 16-01-2006 à 14:30:05    

il faut employer la fonction verifFormulaire sur l'évènement onsubmit du <form>
 
et dans verifFormulaire, après chaque Alert(); il faut faire un return false; afin de dire au navigateur, "Va te faire foutre, je ne veux pas que tu envoies le formulaire".
 
sion tu peux virer cette ligne en début de ta page :  
<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>  
 
et cette ligne de bouseux :
<script language="javascript1.5" src="scripts/verif_formulaire.js"></script>  
tu me la transforme en :  
<script type="text/javascript" src="scripts/verif_formulaire.js"></script>  
 
Merci
 
 
Je rajouterai aussi que de nos jours on accède aux éléments d'une page via leur id :  
ma monelementenvariable = document.getElementById("monelement" );
 
dans ton cas c'est pas la mort on va dire.
et n'oublie surtout pas de faire aussi les tests coté serveur, c'est extrêmement important. Car le javascript, ca se contourne les doigts dans le nez


Message édité par gatsu35 le 16-01-2006 à 14:32:30
Reply

Marsh Posté le 16-01-2006 à 14:39:40    

:ouimaitre:
et ce que tu dis sur l'aaces au element par leur id cela veu dire qu'on est plus obligé de renseigné le:  name="" ??? ou alors j'ai pa tou compris encore

Reply

Marsh Posté le 16-01-2006 à 14:54:57    

name="", sert suelement à identifier un élément de formulaire lorsque celui-ci est envoyé au serveur pour traitement
 
ex: <input type="text" name="nom">
et niveau serveur tu auras un truc du genre : $_POST["nom"];
 
l'id lui est normalisé pour accéder à n'importe quel élément d'une page, il suffit juste que cet élément possède un id
 
<div id="mondiv"></div>
<input type="text" name="nom" id="nom">
 
pour accéder aux éléments d'un formulaire, on utilise normalement les id, ça paraît lourd c'est vrai mais c'est normalisé. name c'est déprécié au niveau javascript, mais name doit être utilisé lorsque l'élément sera posté au serveur. tu me suis ??

Reply

Marsh Posté le 16-01-2006 à 15:01:21    

mouai j'arrive a suivre
je vais le refaire avec les id

Reply

Marsh Posté le 16-01-2006 à 15:13:46    

euh en fait g sui perdu
regarde le bou de ce code:
<legend>Coordonnées </legend>
  <label for="txtNomSociete" class="formlabel">Nom&nbsp;de&nbsp;la&nbsp;soci&eacute;t&eacute;: </label>
    <input type="text" name="txtNomContact" id="txtNormal" tabindex="12" onkeypress="if (this.value.length>20) this.style.width=this.value.length*0.5+'em'" /><br />
    <label for="txtNomContact" class="formlabel">Nom du contact&nbsp;: </label>
    <input type="text" name="txtNomContact" id="txtNormal" tabindex="1" onkeypress="if (this.value.length>20) this.style.width=this.value.length*0.5+'em'" /><br />
 
le deux id ont le meme nom je m'en seravit pour ma feuille css mais en fait je crois que je vais utiliser des class pour ma css.
pour les id il faut qu'il soit unique pour chaque element???  
 
donc si j'ai bine compris moi qui avait mis ca :
formulaire.renseignements.checked !=false
 
faut que je le remplace par ca:
formulaire.getElementById("renseignements" ).checked!=false

Reply

Marsh Posté le 16-01-2006 à 15:22:26    

bedomon a écrit :

euh en fait g sui perdu
regarde le bou de ce code:
<legend>Coordonnées </legend>
  <label for="txtNomSociete" class="formlabel">Nom&nbsp;de&nbsp;la&nbsp;soci&eacute;t&eacute;: </label>
    <input type="text" name="txtNomContact" id="txtNormal" tabindex="12" onkeypress="if (this.value.length>20) this.style.width=this.value.length*0.5+'em'" /><br />
    <label for="txtNomContact" class="formlabel">Nom du contact&nbsp;: </label>
    <input type="text" name="txtNomContact" id="txtNormal" tabindex="1" onkeypress="if (this.value.length>20) this.style.width=this.value.length*0.5+'em'" /><br />
 
le deux id ont le meme nom je m'en seravit pour ma feuille css mais en fait je crois que je vais utiliser des class pour ma css.
pour les id il faut qu'il soit unique pour chaque element???  
 


comme tu peux le voir, le for du label est associé au id de l'élément
mais un id est unique dans une page, si tu veux style, utilise alors une classe. mais tu peux très bien spécifier l'id s'il a du styling particulier
 
 

bedomon a écrit :


donc si j'ai bine compris moi qui avait mis ca :
formulaire.renseignements.checked !=false
 
faut que je le remplace par ca:
formulaire.getElementById("renseignements" ).checked!=false


[/quotemsg]
ouais presque :  
document.getElementById("renseignements" ).checked!=false[/quotemsg]
 
getElementById est une méthode de l'objet document et c'est tout, puisqu'un id est unique dans une page, ben getElementById n'est valable que sur l'objet document, qui représente ta page.
 
sinon t'emmerde pas 90% des developpeurs font : monformulaire.montrucaveclename.savaleur
 
même si ce n'est pas du tout correct, tu vas pas non plus tout refaire
 
get

Reply

Marsh Posté le 16-01-2006 à 15:22:26   

Reply

Marsh Posté le 16-01-2006 à 15:27:42    

:non: autant prendre de bonne manier des le departs alors je refair mon fichier JS :bounce:
 
je vien de me rendre compte de mon erreur c'est qu'avec dreamweaver 8 quand on tape id il fait apparaitre un menu contextuelle avec les differentes entré qu'il y a dans le feuille de style :spamafote:


Message édité par bedomon le 16-01-2006 à 15:30:19
Reply

Marsh Posté le 16-01-2006 à 15:30:42    

ca, c'est une bonne réflexion qui fait plaisir à voir. :)

Reply

Marsh Posté le 16-01-2006 à 15:59:19    

c'est pas tous les jours qu'on voit des personnes nous écouter, surtout quand on leur dit: "t'emmerde pas, ton truc il marche, te fais pas chier à tout modifier" :D
chapeau.
 
heu de quelle erreur tu parles avec dreamweaver 8 ?

Reply

Marsh Posté le 16-01-2006 à 16:12:45    

snifff snifff snifffffff  
ca marche po pourquoi ô mon dieu pourquoi.........???????
donc voila le code html :::
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="css/styleFormulaire.css" />
<title>Demande de renseignements</title>
<script type="text/javascript" src="scripts/verif_formulaire.js"></script>
</head>
 
<body>
<form id="form1" name="formulaire" method="post" action="traitement_formulaire.asp">
 <p>
 <fieldset>
 <legend>Coordonnées </legend>
  <label for="txtNomSociete" class="formlabel">Nom&nbsp;de&nbsp;la&nbsp;soci&eacute;t&eacute;: </label>
    <input type="text" name="NomSociete" id="nomSociete" class="normal" tabindex="0" onkeypress="if (this.value.length>20) this.style.width=this.value.length*0.5+'em'" /><br />
    <label for="txtNomContact" class="formlabel">Nom du contact&nbsp;: </label>
    <input type="text" name="NomContact" id="nomContact" class="normal" tabindex="1" onkeypress="if (this.value.length>20) this.style.width=this.value.length*0.5+'em'" /><br />
    <label for="txtAdresseSociete" class="formlabel">Adresse&nbsp;: </label>
    <textarea name="txtAreaAdresse" id="ndresseSociete" class="textArea" tabindex="2" wrap="virtual"></textarea><br />
    <label for="txtCp" class="formlabel">Code postal&nbsp;: </label>
    <input type="text" name="cp" id="cp" class="codePostal" tabindex="3"  /><br />
    <label for="txtVille" class="formlabel">Ville&nbsp;:</label>
    <input type="text" name="ville" id="ville" class="normal" tabindex="4" onkeypress="if (this.value.length>20) this.style.width=this.value.length*0.5+'em'" /><br />
    <label for="menuPays" class="formlabel">Pays&nbsp;:</label>
    <select name="menuPays" tabindex="5">
     <option value="France" selected="selected">France</option>
   <option value="Dom-Tom">Dom-Tom</option>
   <option value="Belgique">Belgique</option>
   <option value="Espagne">Espagne</option>
   <option value="Suisse">Suisse</option>
   <option value="Allemagne">Allemagne</option>
   <option value="Autre">Autre...</option>
  </select>
  <input type="text" name="autrePays" id="Autre" class="autrePays" tabindex="6" onkeypress="if (this.value.length>20) this.style.width=this.value.length*0.5+'em'" /><br />
  <script language="javascript1.5">
   if window.document.formulaire.menuPays.selectedIndex = (5) {
    window.document.formulaire.txtAutrePays.disabled = "false";
   }
  </script>
  <script language="javascript1.5">
   var numIndexPays = window.document.formulaire.menuPays.selectedIndex;
   var nomIndexPays = window.document.formulaire.menuPays.option[numIndexPays].value;
  </script>
    <label for="txtTelSociete" class="formlabel">T&eacute;l&eacute;phone&nbsp;: </label>
    <input type="text" name="tel" id="tel" class="telFax" tabindex="7" /><br />
    <label for="txtFaxSociete" class="formlabel">Fax&nbsp;:</label>
    <input type="text" name="fax" id="fax" /><br />
    <label for="txtMail" class="formlabel">Email&nbsp;:</label>
    <input type="text" name="eMail" id="eMail" class="mail" tabindex="8" onkeypress="if (this.value.length>20) this.style.width=this.value.length*0.5+'em'" /><br />
    <label for="txtSiteWeb" class="formlabel">Site web&nbsp;:</label>
    <input type="text" name="siteInternet" id="siteInternet" class="normal" tabindex="9" onkeypress="if (this.value.length>20) this.style.width=this.value.length*0.5+'em'" value="http://"/><br />
   </fieldset>
 <fieldset>
 <legend>Pr&eacute;cisez votre demande</legend>
  <label class="formlabel">Renseignements<input type="checkbox" name="chkRenseignement" checked="checked" id="chkRenseignements" class="checkbox"/></label><br />
  <label class="formlabel">Devis<input type="checkbox" name="chkDevis" id="chkDevis" class="checkbox" /></label><br />
  <label class="formlabel">Rendez-vous<input type="checkbox" name="chkrdv" id="chkRdv" class="checkbox" /></label><br />
  <label for="txtQuestion" class="formlabel">Commentaires&nbsp;:</label>
    <textarea name="txtAreaCommentaire" id="commentaire" class="textArea" tabindex="10" wrapping="virtual"> </textarea><br />  
 
 </fieldset>
    <div class="formlabel">&nbsp; </div>
 
 <input type="submit" name="btnEnvoyer" value="Envoyer" onsubmit="verifFormulaire(this.formulaire);" tabindex="11" align="right" />
   
 </p>
</form>
</body>
</html>
 
 
et voila le fichier js:::::
// JavaScript Document
//fonction de verification du formulaire
function verifFormulaire(formulaire){
 mail = document.formulaire.txtMail.value;
 var place = mail.indexOf("@",1);
 var point = mail.indexOf(".",place+1);
 if ((place > -1)&&(mail.length >2)&&(point > 1)
   && (document.formulaire.getElementById("nomSociete" ).value != "" )  
   && (document.formulaire.getElementById("tel" ).value != "" )  
   && (document.formulaire.getElementById("nomContact" ).value != "" )  
   && (document.formulaire.getElementById("commentaire" ).value != "" )
   && if(document.formulaire.getElementById("menuPays" ).value =="France" ){(document.formulaire.getElementById("tel" ).length == 10)}  
   && ((document.formulaire.getElementById("chkRenseignement" ).checked != false) || (document.formulaire.getElementById("chkDevis" ).checked != false) || (document.formulaire.getElementById("chkRdv" ).checked != false))
   && (document.formulaire.getElementById("txtAreaCommentaire" ) != "" ){
  document.formulaire.submit();
  }else{
  if (document.formulaire.getElementById("nomSociete" ).value == "" ){
   alert('Veuillez saisir le nom de la société');
   return false;
   }else{
   if (document.formulaire.getElementById("tel" ).value == "" ) || (document.formulaire.getElementById("tel" ).length !=10){
    alert('Veuillez saisir un numéro de téléphone valide ');
    return false;
            }else{
    if (document.formulaire.getElementById("nomContact" ).value == "" ){
     alert('Veuillez saisir votre nom');
     return false;
     }else{
     if ((document.formulaire.getElementById("chkRenseignements" ).checked==false) || (document.formulaire.getElementById("chkDevis" ).checked==false) || (document.formulaire.getElementById("chkRdv" ).checked==false)){
      alert('veuillez coché votre type de demande')
      return false;
      }else{
          if (document.formulaire.getElementById("txtAreaCommentaire" ).value == "" ){
       alert('Entrez votre demande, svp !!');
       return false;
        }else{
           alert('Entrez une adresse e-mail valide, svp !!');
        return false;
       }
                  }
     }
    }
   }
  }
}
 
 :sweat:   :sweat:   :sweat: j'ai tou fai comme tu m'a di et pourtant rien de chez rien :??:   :??:   :??:


Message édité par bedomon le 16-01-2006 à 16:14:08
Reply

Marsh Posté le 16-01-2006 à 16:21:51    

ah et on ne se moque pas du mini bout de javascript en plein milieu j'ai voulu essayer un truc pour rendre enalbe ou visible la zone de texte juste a coté du menu des pays mais a marche po.... mais je m'y replongerai plus tard enfin bon si quelqu'un a la mega solution de la mort qui tue moi je ne dis pas non...

Reply

Marsh Posté le 16-01-2006 à 16:47:56    

code tiens essaye avec ça, ça devrait mieux marcher:

Code :
  1. function verifFormulaire(){
  2.   //test sur le mail
  3.   mail = document.getElementById('eMail').value;
  4.   var place = mail.indexOf("@",1);
  5.   var point = mail.indexOf(".",place+1);
  6.   if ( place > -1 && mail.length >2 && point > 1 ){
  7.     alert('Entrez une adresse e-mail valide, svp !!');
  8.     return false;
  9.   }
  10.   //test du nom de societe
  11.   if (document.getElementById("nomSociete" ).value == "" ){
  12.     alert('Veuillez saisir le nom de la société');
  13.     return false;
  14.   }
  15.   //test sur le telephone
  16.   if (document.getElementById("tel" ).value == "" || document.getElementById("tel" ).value.length !=10){
  17.     alert('Veuillez saisir un numéro de téléphone valide ');
  18.     return false;
  19.   }
  20.   // test sur le contact
  21.   if (document.getElementById("nomContact" ).value == "" ){
  22.     alert('Veuillez saisir votre nom');
  23.     return false;
  24.   }
  25.   // test sur le type de demande
  26.   if (document.getElementById("chkRenseignements" ).checked==false && document.getElementById("chkDevis" ).checked==false && document.getElementById("chkRdv" ).checked==false){
  27.     alert('veuillez coché votre type de demande')
  28.       return false;
  29.   }
  30.   // test sur la demande
  31.   if (document.getElementById("txtAreaCommentaire" ).value == "" ){
  32.     alert('Entrez votre demande, svp !!');
  33.     return false;
  34.   }
  35.   // submit si tout est ok
  36.   return true;
  37. }


J'en ai profité pour la refaire un peu c'était vraiment trop dégueu ton truc.
 
Par contre ce genre de système de controle je trouve ça a vomir!
Je saisis je valide message d'erreur ... Je re-saisis je re-valide re-message d'erreur ... Je re-re-saisis je re-re-valide re-re-message d'erreur!
Fais plutôt un système qui controle tous les champs en erreur et change leur couleur de fond en rouge ( par exemple) quand ce n'est pas bon, le tout accompagné d'un petit message qui va bien!

Reply

Marsh Posté le 16-01-2006 à 17:16:01    

oula pas de pb mais chaque chose en son temps j'ai pensé deja a ce que tu me propose mais pour le moment je fais un script a la hauteur de mon niveau et je me suis appuyer sur le mini tuto de cette adresse http://www.allhtml.com/javascript/javascript491.php et ensuite je te ferai l'ultime script of verification...  ;)
 
si tu veux bien me donner la demarche a suivre pour ta methode je me lancerais bien mais je ne vois pas du tout comment je dois commencer et comment je dois coder tout ca :cry:


Message édité par bedomon le 16-01-2006 à 17:35:29
Reply

Marsh Posté le 16-01-2006 à 19:13:00    

http://www.allhtml.com =>>> beurkkkkkkkkk
ce site, c'est tout sauf ce qu'il faut aller voir pour le JS :D

Reply

Marsh Posté le 17-01-2006 à 09:20:15    

sir yes sir
 
:ouimaitre:

Reply

Marsh Posté le 17-01-2006 à 10:44:19    

bon alors maintenant quand je clique sur le bouton il me prend en compte le script mais (ily a toujours un mais) il me fais n'importe quoi avec et au niveau de la verification de l'email c'est pas ca du tout..... en ayant repris le code d'anpajari ca donne ca
le probleme que je rencontre sont que mem si l'adresse est valide ca marche pas et si il n'y a rien dans la zone de texte ca me met pas de message d'erreur

Code :
  1. function verifFormulaire(){
  2.        //test sur le mail
  3.    var arobase = document.formulaire.indexOf("@" );
  4.    var point = document.formulaire.lastIndexOf("." );
  5.    var espace = document.formulaire.indexOf(" " );
  6.    if (!((arobase != -1) && //presence d'un @ dans l'email
  7.   (arobase != 0) && //a une position autre que 0
  8.   (point != -1) && //presence d'un point
  9.   (point > arobase +1) && //presence d'un caractere entre le @ et le point
  10.   (point < document.formulaire.getElementById("eMail" ).length - 1) && //le point n'est pas en derniere place de l'email
  11.   (espace == -1))){//pas d'espace dans l'adresse
  12.    return false;
  13.    }
  14.       //test du nom de societe
  15.        if (document.getElementById("nomSociete" ).value == "" ){
  16.          alert('Veuillez saisir le nom de la société');
  17.          return false;
  18.        }
  19.        //test sur le telephone
  20.        if (document.getElementById("tel" ).value == "" || document.getElementById("tel" ).value.length !=10){
  21.          alert('Veuillez saisir un numéro de téléphone valide ');
  22.          return false;
  23.        }
  24.        // test sur le contact
  25.        if (document.getElementById("nomContact" ).value == "" ){
  26.          alert('Veuillez saisir votre nom');
  27.          return false;
  28.        }
  29.        // test sur le type de demande
  30.        if (document.getElementById("chkRenseignement" ).checked==false && document.getElementById("chkDevis" ).checked==false && document.getElementById("chkRdv" ).checked==false){
  31.          alert('veuillez coché votre type de demande')
  32.            return false;
  33.        }
  34.        // test sur la demande
  35.        if (document.getElementById("commentaire" ).value == "" ){
  36.          alert('Entrez votre demande, svp !!');
  37.          return false;
  38.        }
  39.        // submit si tout est ok
  40.        return true;
  41.       }


Message édité par bedomon le 17-01-2006 à 11:04:53
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed

© 2018 Forum. All Rights Reserved.