Accueil > > > FUNCTIONS DE CONTROLE DE SAISIE D'UN FORMULAIRE.
FUNCTIONS DE CONTROLE DE SAISIE D'UN FORMULAIRE.
Information sur la source
Description
Cette function, en javascript, permet de parcourir tous les éléments d'un formulaire et de vérifier, selon certaines regles, si l'utilisateur n'a pas mis n'importe quoi :) Le seul impératif est de nommer ses éléments selon une certaine norme : XY_[Nom_de_l'élément] X = O,o ou F,f ( Obligatoire ou Facultatif ) Y = Type d'element c,C ; d,D ; n,N ; T,t ; r,R ; b,B = Combobox; Date; Numérique; Texte; Radio; CheckBox Les fonctions suivantes servent à vérifier la date et à enlever le "XY_" devant les noms des éléments.
Source
- <script LANGUAGE="JavaScript">
-
- /*
- Type : c,C ; d,D ; n,N ; T,t ; r,R ; b,B (Combobox, Date, Numérique, Texte ( alphanumérique ), Radio, CheckBox)
- Option : o,O ou f,F (Obligatoire ou Facultatif)
- */
- function Verif_Forms(MonForm)
- {
- var ok;
- var NbBox;
- var NbRadio;
- var NbElements = MonForm.elements.length;
- // Boucle tous les éléments du formulaire
- for (var l = 0; l < NbElements; l++)
- {
- var Nom_Element = MonForm.elements[l].name;
- var Nom_Lowercase = Nom_Element.toLowerCase();
- var Champ = MonForm.elements[l];
- // Verifie que l'element n'est pas vide si il est obligatoire
- if (Nom_Lowercase.substring(0,1) == "o" && Champ.value == "")
- {
- alert("Le champ suivant est obligatoire : " + Champ.id );
- Champ.focus();
- return false;
- }
- // Verifie que l'element contient bien une date même si ce champ n'est pas obligatoire à remplir
- if (Nom_Lowercase.substring(1,2) == "d")
- {
- // Appel à la fonction Control_Date
- if (! Control_Date(Champ.value))
- {
- alert("Format de date invalide pour le champ " + Champ.id + ".\nLe format de date valide est JJ/MM/AAAA" );
- Champ.focus();
- return false;
- }
- }
- // Verifie que l'element ne contient que des chiffres même si ce champ n'est pas obligatoire à remplir
- if (Nom_Lowercase.substring(1,2) == "n")
- {
- if (isNaN(Champ.value))
- {
- alert("Le champ suivant est numérique : " + Champ.id );
- Champ.focus();
- return false;
- }
- }
- // Verifie que l'utilisateur a fait un choix dans la combobox
- // ATTENTION :
- // Implique la déclaration d'une option dans le select avec la valeur -1 **
- if (Nom_Lowercase.substring(0,1) == "o" && Nom_Lowercase.substring(1,2) == "c" )
- {
- if (Champ.value == -1)
- {
- alert("Le champ suivant est obligatoire : " + Champ.id);
- Champ.focus();
- return false;
- }
- }
- // Controle qu'un boutton radio a été selectionné
- if (Nom_Lowercase.substring(0,1) == "o" && Nom_Lowercase.substring(1,2) == "r")
- {
- ok = false;
- // getElementsByName([Nom_element]).length renvoie le nombre d'element du meme nom
- // Merci bultez
- NbRadio = document.getElementsByName(Nom_Element).length;
- for (var k = 0; k < NbRadio; k++)
- {
- if (document.getElementsByName(Nom_Element)[k].checked == true)
- {
- ok = true
- k = document.getElementsByName(Nom_Element).length;
- }
- }
- if (ok == false)
- {
- alert("Le champ suivant est obligatoire : " + Champ.id);
- Champ.focus();
- return false;
- }
- }
- // Meme chose mais avec des CheckBox
- if (Nom_Lowercase.substring(0,1) == "o" && Nom_Lowercase.substring(1,2) == "b" )
- {
- ok = false;
- NbBox = document.getElementsByName(Nom_Element).length;
- for (var k = 0; k < NbBox; k++)
- {
- if (document.getElementsByName(Nom_Element)[k].checked == true)
- {
- ok = true
- k = document.getElementsByName(Nom_Element).length;
- }
- }
- if (ok == false)
- {
- alert("Le champ suivant est obligatoire : " + Champ.id);
- Champ.focus();
- return false;
- }
- }
- }
- return true;
- }
-
-
- // Si l'element est nul, renvoie True ( "oui, l'element est vide" )
- // Sinon, vérifie la date
- function Control_Date (MaDate)
- {
- var strTemporaire = MaDate;
-
- if (strTemporaire == '')
- return true;
- strTemporaire = formatDate(strTemporaire);
- if (strTemporaire == null)
- return false;
-
- return true;
- }
-
- // Enleve les "XY_" devant le [Nom_de_l'element]
- function Format_Nom (NomChamp)
- {
- var position
- var NomTemp = NomChamp
- position = NomTemp.indexOf("_");
- NomTemp = NomTemp.substr(position,NomTemp.length)
- var reg = new RegExp("_","gi");
- NomTemp = NomTemp.replace(reg," ");
- return NomTemp;
- }
-
-
- // Function qui format une date et vérifie si elle n'est pas farfelue
- // Cette fonction n'est pas de moi. Je sais juste qu'elle vient d'un Cédric
- // Merci à lui
- function formatDate(valeur)
- {
- var JJ;var MM;var AAAA;
- isMatch = false;
- var tabDate
- // L'ordre de lecture des expressions est important
- var expReg1 = /(\d{2})(\d{2})(\d{4}|\d{2})/;
- var expReg2 = /(\d{2}|\d)\/(\d{2}|\d)\/(\d{4}|\d{2})/;
- // tabDate={JJMMAAAA ou JJMMAA}
- tabDate = valeur.match(expReg1);
- if ((tabDate != null) && (tabDate[0] == valeur))
- {
- isMatch = true;
- JJ = tabDate[1];
- MM = tabDate[2];
- if (tabDate[3].length == 2 ) AAAA = '20' + tabDate[3] ;
- else AAAA = tabDate[3];
- }
- // tabDate={JJ/MM/AAAA ou JJ/MM/AA}
- tabDate = valeur.match(expReg2);
- if ((tabDate != null) && (tabDate[0] == valeur))
- {
- isMatch = true;
- if (tabDate[1].length == 1 ) JJ = '0' + tabDate[1];
- else JJ = tabDate[1];
- if (tabDate[2].length == 1 ) MM = '0' + tabDate[2];
- else MM = tabDate[2];
- if (tabDate[3].length == 2 ) AAAA = '20' + tabDate[3] ;
- else AAAA = tabDate[3];
- }
-
- var objDate=new Date(AAAA, (MM - 1) ,JJ);
-
- if ((JJ=='32') && (MM='13') && isMatch) {
- //return JJ + '/' + MM + '/' + AAAA;
- return objDate;
- }
-
- if ( (!isMatch) || (objDate.getDate() != JJ) || ((objDate.getMonth()+1) != MM )) {
- return null;
- }
- //return JJ + '/' + MM + '/' + AAAA;
- return objDate;
- }
-
- </script>
<script LANGUAGE="JavaScript">
/*
Type : c,C ; d,D ; n,N ; T,t ; r,R ; b,B (Combobox, Date, Numérique, Texte ( alphanumérique ), Radio, CheckBox)
Option : o,O ou f,F (Obligatoire ou Facultatif)
*/
function Verif_Forms(MonForm)
{
var ok;
var NbBox;
var NbRadio;
var NbElements = MonForm.elements.length;
// Boucle tous les éléments du formulaire
for (var l = 0; l < NbElements; l++)
{
var Nom_Element = MonForm.elements[l].name;
var Nom_Lowercase = Nom_Element.toLowerCase();
var Champ = MonForm.elements[l];
// Verifie que l'element n'est pas vide si il est obligatoire
if (Nom_Lowercase.substring(0,1) == "o" && Champ.value == "")
{
alert("Le champ suivant est obligatoire : " + Champ.id );
Champ.focus();
return false;
}
// Verifie que l'element contient bien une date même si ce champ n'est pas obligatoire à remplir
if (Nom_Lowercase.substring(1,2) == "d")
{
// Appel à la fonction Control_Date
if (! Control_Date(Champ.value))
{
alert("Format de date invalide pour le champ " + Champ.id + ".\nLe format de date valide est JJ/MM/AAAA" );
Champ.focus();
return false;
}
}
// Verifie que l'element ne contient que des chiffres même si ce champ n'est pas obligatoire à remplir
if (Nom_Lowercase.substring(1,2) == "n")
{
if (isNaN(Champ.value))
{
alert("Le champ suivant est numérique : " + Champ.id );
Champ.focus();
return false;
}
}
// Verifie que l'utilisateur a fait un choix dans la combobox
// ATTENTION :
// Implique la déclaration d'une option dans le select avec la valeur -1 **
if (Nom_Lowercase.substring(0,1) == "o" && Nom_Lowercase.substring(1,2) == "c" )
{
if (Champ.value == -1)
{
alert("Le champ suivant est obligatoire : " + Champ.id);
Champ.focus();
return false;
}
}
// Controle qu'un boutton radio a été selectionné
if (Nom_Lowercase.substring(0,1) == "o" && Nom_Lowercase.substring(1,2) == "r")
{
ok = false;
// getElementsByName([Nom_element]).length renvoie le nombre d'element du meme nom
// Merci bultez
NbRadio = document.getElementsByName(Nom_Element).length;
for (var k = 0; k < NbRadio; k++)
{
if (document.getElementsByName(Nom_Element)[k].checked == true)
{
ok = true
k = document.getElementsByName(Nom_Element).length;
}
}
if (ok == false)
{
alert("Le champ suivant est obligatoire : " + Champ.id);
Champ.focus();
return false;
}
}
// Meme chose mais avec des CheckBox
if (Nom_Lowercase.substring(0,1) == "o" && Nom_Lowercase.substring(1,2) == "b" )
{
ok = false;
NbBox = document.getElementsByName(Nom_Element).length;
for (var k = 0; k < NbBox; k++)
{
if (document.getElementsByName(Nom_Element)[k].checked == true)
{
ok = true
k = document.getElementsByName(Nom_Element).length;
}
}
if (ok == false)
{
alert("Le champ suivant est obligatoire : " + Champ.id);
Champ.focus();
return false;
}
}
}
return true;
}
// Si l'element est nul, renvoie True ( "oui, l'element est vide" )
// Sinon, vérifie la date
function Control_Date (MaDate)
{
var strTemporaire = MaDate;
if (strTemporaire == '')
return true;
strTemporaire = formatDate(strTemporaire);
if (strTemporaire == null)
return false;
return true;
}
// Enleve les "XY_" devant le [Nom_de_l'element]
function Format_Nom (NomChamp)
{
var position
var NomTemp = NomChamp
position = NomTemp.indexOf("_");
NomTemp = NomTemp.substr(position,NomTemp.length)
var reg = new RegExp("_","gi");
NomTemp = NomTemp.replace(reg," ");
return NomTemp;
}
// Function qui format une date et vérifie si elle n'est pas farfelue
// Cette fonction n'est pas de moi. Je sais juste qu'elle vient d'un Cédric
// Merci à lui
function formatDate(valeur)
{
var JJ;var MM;var AAAA;
isMatch = false;
var tabDate
// L'ordre de lecture des expressions est important
var expReg1 = /(\d{2})(\d{2})(\d{4}|\d{2})/;
var expReg2 = /(\d{2}|\d)\/(\d{2}|\d)\/(\d{4}|\d{2})/;
// tabDate={JJMMAAAA ou JJMMAA}
tabDate = valeur.match(expReg1);
if ((tabDate != null) && (tabDate[0] == valeur))
{
isMatch = true;
JJ = tabDate[1];
MM = tabDate[2];
if (tabDate[3].length == 2 ) AAAA = '20' + tabDate[3] ;
else AAAA = tabDate[3];
}
// tabDate={JJ/MM/AAAA ou JJ/MM/AA}
tabDate = valeur.match(expReg2);
if ((tabDate != null) && (tabDate[0] == valeur))
{
isMatch = true;
if (tabDate[1].length == 1 ) JJ = '0' + tabDate[1];
else JJ = tabDate[1];
if (tabDate[2].length == 1 ) MM = '0' + tabDate[2];
else MM = tabDate[2];
if (tabDate[3].length == 2 ) AAAA = '20' + tabDate[3] ;
else AAAA = tabDate[3];
}
var objDate=new Date(AAAA, (MM - 1) ,JJ);
if ((JJ=='32') && (MM='13') && isMatch) {
//return JJ + '/' + MM + '/' + AAAA;
return objDate;
}
if ( (!isMatch) || (objDate.getDate() != JJ) || ((objDate.getMonth()+1) != MM )) {
return null;
}
//return JJ + '/' + MM + '/' + AAAA;
return objDate;
}
</script>
Conclusion
"Champ.id" est la valeur "id" donnée à l'element dans le code html Dans le cas d'un champ Texte, je pars du principe que ça sera de l'alphanumérique ( lettre + chiffre ). Je ne fais donc que le test d'obligation ou non de saisie du champ.
Historique
- 08 octobre 2004 00:04:54 :
- 08 octobre 2004 12:52:27 :
- - Correction de commentaires dans le source
- Ajout du zip
- 07 février 2005 16:41:11 :
- Correction dans l'encadrée présentation du code. J'avais inversé X et Y dans les explications.
- 08 février 2005 15:25:03 :
- Utilisation de .lowercase(); pour alleger le code et ajout d'une précision sur le cas "Texte". Texte correspond en fait à de l'alphanumérique.
Sources de la même categorie
Commentaires et avis
|
Derniers Blogs
CSS CONTENT STATE SELECTORS (PERSONNAL DRAFT)CSS CONTENT STATE SELECTORS (PERSONNAL DRAFT) par FREMYCOMPANY
Bonjour à tous, Je viens de publier une proposition comprenant 5 pseudo-classes pour le CSS Working Group ayant trait à l'état de chargement d'un élément (ex: IMG,VIDEO,AUDIO,OBJECT pour l'HTML.). Si le c½ur vous en dit, vous pouvez retrouver cette p...
Cliquez pour lire la suite de l'article par FREMYCOMPANY MBA : POURQUOI FAIRE ET COMMENT LE CHOISIR ?MBA : POURQUOI FAIRE ET COMMENT LE CHOISIR ? par ROMELARD Fabrice
Formation initiale Durant la formation, le découpage classique est le suivant (je donnerai les équivalences Suisse lorsque je les connaîtrais) : Ecole primaire jusqu'au Collège : Formation générale permettant d'obtenir les méthodes...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice Y'A DES ERREURS QUI PEUVENT RENDRE LE DéVELOPPEUR VIOLENTY'A DES ERREURS QUI PEUVENT RENDRE LE DéVELOPPEUR VIOLENT par Aleks
Quand on a ce genre d'erreur sans log :
Et bas on a juste envie de choper le gas de Microsoft qu'a développé ça et lui foutre des baffes de Coboye ! ...
Cliquez pour lire la suite de l'article par Aleks [HYPER-V 3] PRéSENTATION DES COMMANDLETS POWERSHELL[HYPER-V 3] PRéSENTATION DES COMMANDLETS POWERSHELL par Pierrick CATRO-BROUILLET
Avec la sortie prochaine de la Beta Consumer Preview de Windows 8, j'avais envie de revenir sur une des fonctionnalités que j'attends le plus et que, en bon geek que je suis, j'utilise déjà : Hyper-V 3 ainsi son module PowerShell.
Il y a déjà pléthor...
Cliquez pour lire la suite de l'article par Pierrick CATRO-BROUILLET IIS7 - COMPRESSION GZIPIIS7 - COMPRESSION GZIP par cyril
La compression GZIP permet d'améliorer les performances de navigation en compressant ce qu'envoie le serveur à un client. Pour comprendre comment cela fonctionne, regardons ce qu'il se passe au niveau HTTP lorsqu'un client tente d'accéder à une ress...
Cliquez pour lire la suite de l'article par cyril
Logiciels
Academy System (17.2.1.0)ACADEMY SYSTEM (17.2.1.0)Logiciel de gestion des établissements.
- élèves/étudiants (inscription, dossier, absence...)
-... Cliquez pour télécharger Academy System Easy-Planning (1.0.0.1)EASY-PLANNING (1.0.0.1)Basé sur les mêmes principes que MyPlanning, Easy-Planning permet de créer des plannings sous la ... Cliquez pour télécharger Easy-Planning COLLECTOR PLUS (3.00B)COLLECTOR PLUS (3.00B)COLLECTOR PLUS version 3.00B est un logiciel utilisant une base de données alimentée par :
- L... Cliquez pour télécharger COLLECTOR PLUS PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V7.4)PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V7.4)PONAMEDIA TV DEVIENS HELLLOOO FLASH
LA TV SUR VOTRE ORDINATEUR.
Toute une plateforme Multi... Cliquez pour télécharger PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO LettresFaciles 2011 (8.0.0.1)LETTRESFACILES 2011 (8.0.0.1)LettresFaciles est un logiciel facilitant la création et la rédaction de lettres types.
Son inte... Cliquez pour télécharger LettresFaciles 2011
|