AccueilCodesTutorielsForumsEmploiLivresConnexion

  • Javascript / Ajax / DHTML CodeS-SourceS
  • RSS CodeS-SourceS
  • CodyxBot, le Bot GTalk & MSN qu'il vous faut !
  • Générez des revenus avec vos codes, scripts et tutoriaux
  • Aide à la navigation du site
begin process at 2009 01 10 01:56:42
Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

SCRIPT KIT "JAVASCRIPT" DE VERIFICATION D'UN FORMULAIRE


Information sur la source

Catégorie :Formulaire Classé sous : javascript, formulaire, verification, champ, input Niveau : Expert Date de création : 01/12/2005 Date de mise à jour : 04/12/2005 12:46:52 Vu : 27 278
Auteur : raydan Site perso
Ecrire un message privé
Note :
9 / 10 - par 2 personnes
9,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Commentaire sur cette source (5)
Ajouter un commentaire et/ou une note

Description

J'ai reflechis sur un code Javascript qui permet de verifier automatiquement si tous les champs d'un formulaire sont renseigné (sans ternir compte du type de donnée qui y est inscrit) . Ainsi, quelque soit votre formulaire ce code fonctionnera. Seuleument verifier la position de votre formulaire dans le DOM de la page web. dans ce script il n'y a qu'un seul formulaire donc le tableau forms a pour indice 0 =>forms[0]. Treve de bavardage. le script
 

Source

  • script : autre.js
  • function check_input(){
  • var message_alert = "";
  • for(var i = 0; i < window.document.forms[0].length ; i++) {
  • var rechRapide = window.document.forms[0].elements[i].value;
  • var nom_champ = window.document.forms[0].elements[i].name;
  • window.document.forms[0].elements[i].style.backgroundColor = "#FFFFFF";
  • if(rechRapide == "") {
  • window.document.forms[0].elements[i].focus();
  • window.document.forms[0].elements[i].style.backgroundColor = "#CCCCCC";
  • message_alert +=" Veuillez remplir le champ " + nom_champ +"\n";
  • }
  • }
  • if (message_alert == "") {
  • return true;
  • } else {
  • message_alert = "Informations omises dans le formulaire : \n" + message_alert;
  • alert(message_alert);
  • return false;
  • }
  • }
  • fichier html : index.html
  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  • "http://www.w3.org/TR/html4/loose.dtd">
  • <html>
  • <head>
  • <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  • <title>Essai verif champ </title>
  • <script type="text/javascript" src="autre.js"> </script>
  • </head>
  • <body>
  • <form name="form1" method="GET" action="lire.php" onSubmit = "var resultat = check_input(); return resultat;" >
  • <table width="500" border="0" cellspacing="0" cellpadding="2" class="Texte_form">
  • <tr>
  • <td width="84">Numéro client </td>
  • <td><input type="text" name="Numéro_client" value="" size="6">
  • </td>
  • <td colspan="2"> </td>
  • </tr>
  • <tr>
  • <td>NOVA </td>
  • <td width="82"><input type="text" name="NOVA" value="" size="6">
  • </td>
  • <td width="102">Numero classement </td>
  • <td width="116"><input type="text" name="Numero_classement" value="" size="6"></td>
  • </tr>
  • <tr>
  • <td colspan="4"><table width="390" border="0" cellspacing="0" cellpadding="2" class="Texte_form">
  • <tr>
  • <td width="83">Nom du client</td>
  • <td colspan="3"><input type="text" name="Nom_du_client" value="" size="35"></td>
  • </tr>
  • <tr>
  • <td>Dénomination</td>
  • <td colspan="3"><input type="text" name="Dénomination" value="" size="35"></td>
  • </tr>
  • <tr>
  • <td>Adresse client</td>
  • <td colspan="3"><input type="text" name="Adresse_client" value="" size="35"></td>
  • </tr>
  • <tr>
  • <td>Adresse suite</td>
  • <td colspan="3"><input type="text" name="Adresse_suite" value="" size="35"></td>
  • </tr>
  • <tr>
  • <td>Code postal </td>
  • <td width="86"><input type="text" name="Code_postal" value="" size="6"></td>
  • <td width="28">Ville</td>
  • <td width="177"><input type="text" name="Ville" value="" size="18"></td>
  • </tr>
  • </table>
  • <input type="image" src="img/save.gif" width="31" height="29" name="Submit">
  • </form>
  • </body>
  • </html> 
script : autre.js

function check_input(){
   var message_alert = "";
   for(var i = 0; i < window.document.forms[0].length ; i++) {
      var rechRapide = window.document.forms[0].elements[i].value;
      var nom_champ = window.document.forms[0].elements[i].name;
      window.document.forms[0].elements[i].style.backgroundColor = "#FFFFFF";
      if(rechRapide == "") {
         window.document.forms[0].elements[i].focus();
         window.document.forms[0].elements[i].style.backgroundColor = "#CCCCCC";
         message_alert +=" Veuillez remplir le champ " + nom_champ +"\n";
      }
   }
   if (message_alert == "") {
         return true;
      } else {
         message_alert = "Informations omises dans le formulaire : \n" + message_alert;
         alert(message_alert);
         return false;
         }
} 


fichier html : index.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Essai verif champ </title>
<script type="text/javascript" src="autre.js"> </script>
</head>

<body>
<form name="form1" method="GET" action="lire.php" onSubmit = "var resultat = check_input(); return resultat;" >
<table width="500" border="0" cellspacing="0" cellpadding="2" class="Texte_form">
              <tr>
                <td width="84">Numéro client </td>
                <td><input type="text" name="Numéro_client" value="" size="6">
                </td>
                <td colspan="2"> </td>
              </tr>
              <tr>
                <td>NOVA </td>
                <td width="82"><input type="text" name="NOVA" value="" size="6">
                </td>
                <td width="102">Numero classement </td>
                <td width="116"><input type="text" name="Numero_classement" value="" size="6"></td>
              </tr>
              <tr>
                <td colspan="4"><table width="390" border="0" cellspacing="0" cellpadding="2" class="Texte_form">
                    <tr>
                      <td width="83">Nom du client</td>
                      <td colspan="3"><input type="text" name="Nom_du_client" value="" size="35"></td>
                    </tr>
                    <tr>
                      <td>Dénomination</td>
                      <td colspan="3"><input type="text" name="Dénomination" value="" size="35"></td>
                    </tr>
                    <tr>
                      <td>Adresse client</td>
                      <td colspan="3"><input type="text" name="Adresse_client" value="" size="35"></td>
                    </tr>
                    <tr>
                      <td>Adresse suite</td>
                      <td colspan="3"><input type="text" name="Adresse_suite" value="" size="35"></td>
                    </tr>
                    <tr>
                      <td>Code postal </td>
                      <td width="86"><input type="text" name="Code_postal" value="" size="6"></td>
                      <td width="28">Ville</td>
                      <td width="177"><input type="text" name="Ville" value="" size="18"></td>
                    </tr>
                </table>
<input type="image" src="img/save.gif" width="31" height="29" name="Submit">
</form>
</body>
</html>

Historique

04 décembre 2005 12:46:52 :
Les champs renseigné par la suite voient leur fond reapparaitre en blanc à la prochaine validation.

Commentaires et avis

signaler à un administrateur
Commentaire de ivanoff1 le 02/12/2005 09:09:47

Salut !!

Sympa comme source :o)

Mais pour ton problème de forms avec l'index == 0,
Tu ne peux pas mettre : document.forms.item("nameFrame") ? (et tu le passe en paramètre à ta function)
Normalement c'est possible, non ?

A pluche

Ivanov

signaler à un administrateur
Commentaire de jjdagadir le 02/12/2005 12:05:08

çà marche bien, et le code est simple, une seule remarque, il faut être vigilent dans le nom des champs car le souscripteur obtient des noms bizarres si ceux ci ne sont pas explicites, comme dans ton fichier exemple d'ailleurs. Mais si on prend soin de créer un formulaire avec des champs explicites que l'on retrouvera lors du renvoi d'ommission par le JS, c'est certainement une très bonne vérif si on veut que tous les champs soient remplis.
bravo pour la simplicité,
Kenavo

signaler à un administrateur
Commentaire de josh666 le 02/12/2005 22:52:56

Pratique le script... mais sa serait bien de vérifier le type de élément du formulaire pour que quand c'est un select et bien sa vérifie si l'élément sélectionner est différent de l'élément de départ ( ds les formulaire du met choisir comme premier élément)

Bonne continuation

signaler à un administrateur
Commentaire de abdelaziz_info le 03/12/2005 07:55:46



C’est bien sauf que les éléments ratés et formatés plus tard gardent  le même fond comme si n’est rien changé tester le code comme ceci et merci :




function check_input(){

   var message_alert = "";
   for(var i = 0; i < window.document.forms[0].length ; i++) {
  

      var rechRapide = window.document.forms[0].elements[i].value;
      var nom_champ = window.document.forms[0].elements[i].name;
      
      
///////////////////////////////////////////////// Background des éléments déjà formatés      
window.document.forms[0].elements[i].style.backgroundColor = "#FFFFFF";    
//////////////////////////////////////////////////  
        
if(rechRapide == "") {
window.document.forms[0].elements[i].focus();
window.document.forms[0].elements[i].style.backgroundColor = "#CCCCCC";
message_alert +=" Veuillez remplir le champ " + nom_champ +"\n";
}
}
   if (message_alert == "") {
  
    
         return true;
        
        
      } else {

  
      
         message_alert = "Informations omises dans le formulaire : \n" + message_alert;
        
         alert(message_alert);
        


         return false;
            
}
}

signaler à un administrateur
Commentaire de vaesoli le 09/02/2006 11:26:21

ça marche super bien mais seulement avec un seul formulaire, quand j'ais essayé de placer la vérification pour deux formulaires se trouvant sur la même page, et bien le script qui fonctionnait très bien sous Firefox et IE s'est mis à déconner sous IE, aurais tu une solution?

Ajouter un commentaire

Discussions en rapport avec ce code source dans le forum

verification champ de formulaire [ par elanspeech ] Bonjour,Je souhaiterais verifier le bon formatage et la validite d'une date entree dans un champ de formulaire.formatage jj/mm/aaaa, avec jj &lt; 32, Formulaire avec verification dynamique [ par bladebo ] BonjourVoila j'aimerai savoir comment faire pour vérifier un formulaire et faire un affichage qui se modifie si certaines zones du formulaire ne sont Question javascript!! [ par flox22 ] Salut tout le monde voila je debute en javascript et g besoin d'un peu d'aide. G un formulaire a plusieurs champ du style &lt;input type="text" name valeur d'un champ formulaire récupèrer d'un code javascript [ par katousa ] bonjour, je viens de commencer &#224; programmer avec javascript, mon pb, est queje veux afficher la valeur du date et l'heure actuel&nbsp;calculer da Ajouter des formulaires .... [ par b_medamine ] je crois que le titre ne dit pas grande chose ... effectivement, puisque je n'ai pas trouver d'expression pour ce que je cherche ... Tout d'abord j'ai changer de champ "input" [ par fifi_pipo ] bonjour,je voudrais savoir s'il est possible de changer de champs "input" automatiquement.je m'explique un peu mieu, c'est a dire que j'ai un formulai Problème de remplissage de champs dans un formulaire [ par fred_surz2002 ] Bonjour,je viens tout juste de me mettre au javascript et je rencontre deja un pb. Voila j'ai cr&#233;e un fichier.jsp qui me permet d'editer un formu boucle pour des textbox [ par ortho_man ] Bonjour,Ne m'y connaissant pas trop en javascript mais connaissant d'autres langages, je cherche le moyen de balayer toutes les textbox d'un formulair Formulaire [ par w_minisplash_w ] Bonjour &#224; tous,J'ai 3 select dont les attributs name sont "azerty[0]['qwerty']", "<font color="#808080" face="Aria erreur de variable [ par Zayl ] Bonjour,J'ai un petit probl&#232;me &#233;pineux concernant du javascript :A partir d'un formulaire de base PHP je r&#233;cup&#232;re une variable "$t


Nos sponsors

Sondage...

CalendriCode

Janvier 2009
LMMJVSD
   1234
567891011
12131415161718
19202122232425
262728293031 

Consulter la suite du CalendriCode

Téléchargements

Logiciels à télécharger sur le même thème :


Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel BAÏSE, Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 0,452 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS


Certaines images présentes sur le site (notament certains avatars) sont issues des collections IconShock, donc si vous souhaitez utiliser ces icons vous devez les acheter, ne les copiez pas et ne utilisez pas dans vos sites et applications sans les avoir commandé.