DevInformatique Ralis par HACHIMI SAFAE Module N 21

Dev-Informatique Réalisé par : HACHIMI SAFAE

Module N° 21 : CRÉATION ET DÉPLOIEMENT SITE DYNAMIQUE LECON 10 : LES CONTROLES DE VALIDATION I-DEFINITION : § La validation des données est en général la close la plus importante dans un site web. § La validation coté client est donc celle qui intervient la première et se fait en général en Java. Script. § ASP. NET fournit des contrôles de validation qui génèrent le code Java. Script associé , vous évitant de connaitre à fond le langage et de voir taper le code.

§ Les principaux contrôles de validation sont : Required. Fieled. Validator Range. Validator Compare. Validator Regular. Expression. Validator Custom. Validator Validation Summary

I-Required. Fieled. Validator : § a donc pour fonction de vérifier qu’un champs a été modifié. 1 -LES PROPRIETES : o Control. To. Validate : doit contenir le nom du contrôle à valider. o Error. Message : message à afficher en cas d’erreur. o Initial. Value : contient une valeur qui invalide le contrôle. o Text : texte affiché en cas de non validation.

EXEMPLE : <asp : Text. Box ID = ‘’Text. Box 1 ‘’ runat = ‘’server ‘’ ></asp : Text. Box> <asp: Required. Fieled. Validator ID runat = ‘’RFV 1 = ‘’server ‘’ Control. To. Validate = ‘’Text. Box 1 ‘’ Display = ‘’Dynamic ‘’ Error. Message = ‘’L’identifiant est obligatoire. ’’ Fore. Color = ‘’Red’’ Text = ’’*’’ Set. Focus. On. Error = ‘’true ‘’> </asp : Required. Fieled. Validator>

II-Range. Validator : § Il sera utilisé pour valider l’encodage entre des formes données. 1 -LES PROPRIETES : o Control. To. Validate : doit contenir le nom du contrôle à valider. o Error. Message : message à afficher en cas d’erreur. o Minimum. Value : valeur minimale de la plage de données. o Maximum. Value : valeur minimale de la plage de données. o Text : texte affiché en cas de non validation.

EXEMPLE : de validation age doit etre entre 1 et 10 : <asp: Label ID = ‘’Label 1 ‘’ runat =‘’server ‘’ Text = ‘’Entrez une valeur comprise entre 1 et 10 : ‘’></asp: Label> <asp: Text. Box ID=‘’Text. Box 1’’ runat =‘’server ‘’ ></asp: Text. Box>

<asp: Range. Validator ID = ‘’RV 1 runat = ‘’server ‘’ Control. To. Validate = ‘’Text. Box 1 ‘’ </asp : Range. Validator> Maximum. Value =‘’ 10 ’’ Minimun. Value =‘’ 1’’ Display = ‘’Dynamic ‘’ Error. Message = ‘’Valeur entre 1 et 10’’ Fore. Color = ‘’Red’’ Text = ’’*’’ Set. Focus. On. Error = ‘’true ‘’>

III-Compare. Validator : § Il utilise un opérateur pour comparer les valeurs en présence et valider leur concordance 1 -LES PROPRIETES : o Control. To. Validate : doit contenir le nom du contrôle à valider. o Error. Message : message à afficher en cas d’erreur. o Initial. Value : contient une valeur qui invalide le contrôle. o Text : texte affiché en cas de non validation.

2 -1: COMPARAISON A UN TYPE : <asp: Text. Box ID=‘’Text. Box 1’’ runat =‘’server ‘’ ></asp: Text. Box> <asp: Compare. Validator ID = ‘’CV 1 runat = ‘’server ‘’ Control. To. Validate = ‘’Text. Box 1 ‘’ Display = ‘’Dynamic ‘’ Error. Message = ‘’Doit etre un chiffre entier de type integer !’’ </asp : Compare. Validator> Type =‘’Integer ‘’ Operator =‘’Data. Type. Check ‘’ Fore. Color = ‘’Red’’ Text = ’’*’’ Set. Focus. On. Error = ‘’true ‘’>

2 -2: COMPARAISON A UNE VALEUR : <asp: Text. Box ID=‘’Text. Box 1’’ runat =‘’server ‘’ ></asp: Text. Box> <asp: Compare. Validator ID = ‘’CV 1 runat = ‘’server ‘’ Validate. To. Compare = ‘’Text. Box 1 ‘’ </asp : Compare. Validator> Display = ‘’Dynamic ‘’ Error. Message = ‘’Un chiffre positif est requis !’’ Type =‘’Integer ‘’ Operator =‘’Greater. Than ‘’ Fore. Color = ‘’Red’’ Text = ’’*’’ Set. Focus. On. Error = ‘’true ‘’>

2 -3: COMPARAISON A UNE AUTRE CHAMPS : VALIDATION DE MOT DE PASSE : <asp: Text. Box ID=‘’Text. Box 1’’ runat =‘’server ‘’ ></asp: Text. Box> <asp: Text. Box ID=‘’Text. Box 2’’ runat =‘’server ‘’ ></asp: Text. Box> (VOIR LA SUITE DE CODE )

<asp: Compare. Validator ID runat = ‘’CV 1 = ‘’server ‘’ Control. To. Compare = ‘’Text. Box 1 ‘’ Control. To. Validate =‘’Text. Box 2 ‘’ Display = ‘’Dynamic ‘’ Error. Message = ‘’Entrez à nouveau mot de passe !’’ Type =‘’String ‘’ Operator =‘’Equal ‘’ Fore. Color = ‘’Red’’ Text = ’’*’’ Set. Focus. On. Error = ‘’true ‘’> </asp : Compare. Validator>

IV-Regular. Expression. Validator : § Ce contrôle valide un champ suivant une expression régulière. § Il convient pour des tests de validation très complexes. 1 -LES PROPRIETES : o Control. To. Validate : doit contenir le nom du contrôle à valider. o Error. Message : message à afficher en cas d’erreur. o Initial. Value : contient une valeur qui invalide le contrôle. o Text : texte affiché en cas de non validation. o Validation. Expression : contient un modèle pour valider le texte saisi.

2 -1: VALIDATION DU CHAMPS EMAIL : <asp: Text. Box ID=‘’Text. Box 1’’ runat =‘’server ‘’ ></asp: Text. Box> <asp: Regular. Expression. Validator runat ID = ‘’REV 1 = ‘’server ‘’ Control. To. Validate = ‘’Text. Box 1 ‘’ Display = ‘’Dynamic ‘’ Error. Message = ‘’Adresse electronique !’’ Validation. Expression =‘’W+([-+. ’]W+)*@W+([-. ]W+. )*. W([-. ]W+) * ‘’ Fore. Color = ‘’Red’’ Text = ’’*’’ Set. Focus. On. Error = ‘’true ‘’> Adresse Eléctronique</ asp: Regular. Expression. Validator >

2 -2: VALIDATION DE MOT DE PASSE : <asp: Text. Box ID=‘’Text. Box 2’’ runat =‘’server ‘’ ></asp: Text. Box> <asp: Regular. Expression. Validator runat ID = ‘’REV 2 = ‘’server ‘’ Control. To. Validate = ‘’Text. Box 2 ‘’ Display = ‘’Dynamic ‘’ Error. Message = ‘’Mot de passe Incorrecte !’’ Validation. Expression =‘’. *[@#&%!=? +*-/]. *‘’ Fore. Color = ‘’Red’’ Text = ’’*’’ Set. Focus. On. Error = ‘’true ‘’> Format Incorrecte </ asp: Regular. Expression. Validator >

2 -3: VALIDATION DU CHAMP CODE POSTAL : <asp: Text. Box ID=‘’Text. Box 3’’ runat =‘’server ‘’ ></asp: Text. Box> <asp: Regular. Expression. Validator runat ID = ‘’REV 3 = ‘’server ‘’ Control. To. Validate = ‘’Text. Box 3 ‘’ Display = ‘’Dynamic ‘’ Error. Message = ‘’Code Postal !’’ Validation. Expression =‘’d{4}‘’ Fore. Color = ‘’Red’’ Text = ’’*’’ Set. Focus. On. Error = ‘’true ‘’> Le code postal doit être constitué de 5 chiffres </ asp: Regular. Expression. Validator >

2 -4 : VALIDATION DU CHAMP TELEPHONE : <asp: Text. Box ID=‘’Text. Box 4’’ runat =‘’server ‘’ ></asp: Text. Box> <asp: Regular. Expression. Validator runat ID = ‘’REV 4 = ‘’server ‘’ Control. To. Validate = ‘’Text. Box 4 ‘’ Display = ‘’Dynamic ‘’ Error. Message = ‘’TELEPHONE !’’ Validation. Expression =‘’(d{3})d{3}-d{4}‘’ Fore. Color = ‘’Red’’ Text = ’’*’’ Set. Focus. On. Error = ‘’true ‘’> Le numéro de téléphone doit être au format: (XXX)XXX-XXXX </ asp: Regular. Expression. Validator >

V-Custom. Validator : § L’utilisateur définit lui-même une fonction pour effectuer la validation lorsque les contrôles standards ne peuvent pas assumer ce rôle. 1 -DANS LE CAS D’UNE VALIDATION COTE CLIENT : 1 -1 : Client. Validate. Function : contient le nom de la fonction. § La fonction doit être sous la forme : Function. Validation. Personnelle(Source , Arguments ) o La source : est l’objet Custom. Validator cote client. o L’argument : est un objet comportant 2 propriétés : Value et Is. Valid o La propriété Value : est la valeur à valider. o La propriété Is. Valid : est un booléen retournent le résultat de la validation. <sript Language=‘’Java. Script’’> function Validation(obj, args){…. }</script> 2 -DANS LE COTE SEREVEUR : On. Servere. Validate

LES PROPRIETES DE CONTRÔLE : L’EVENEMENT DE CONTRÔLE :

EXEMPLE 1: VALIDATION DES DONNEES D’UNE CARTE DE CREDIT : § Code Page 1. aspx. cs protected void Custom. Validator 1_Server. Validate(object source, Server. Validate. Event. Args args) { //VALIDATION NUMERO DE CARTE args. Is. Valid=(Regex. Is. Match(args. Value, ’’^(51|52|44|55)’’)&&(args. Value. Length==16); }

protected void Custom. Validator 2_Server. Validate(object source, Server. Validate. Event. Args args) { //VALIDATION DATE D’expiration (mm/aaaa) Date. Time d ; bool valider = false ; bool date. Valide=Date. Time. try. Parse. Exact(args. Value, ’’MM/YYYY’’, Culture. Info. Invariant. Culture, Date. Time. Styles. None , out d ) ; if(date. Valide){ if(Date. Time. Compare(d. Add. Months(1), Date. Time. Now)>0){ valider=true; } } args. Is. Valid=valider ; }

§ Code Source Page. A. aspx : <asp: Text. Box ID=‘’Text. Box 1’’ runat =‘’server ‘’ ></asp: Text. Box> <asp: Custom. Validator ID = ‘’CV 1 runat = ‘’server ‘’ Control. To. Validate = ‘’Text. Box 1 ‘’ onserver. Validate = ‘’ Custom. Validator 1_Server. Validate ‘’ Display = ‘’Dynamic ‘’ Error. Message = ‘’NUMERO DE CARTE CREDIT !’’ Fore. Color = ‘’Red’’ Text = ’’*’’ Set. Focus. On. Error = ‘’true ‘’/> Le numéro de carte crédit incorrecte

<asp: Text. Box ID=‘’Text. Box 2’’ runat =‘’server ‘’ ></asp: Text. Box> <asp: Custom. Validator ID = ‘’CV 2 runat = ‘’server ‘’ Control. To. Validate = ‘’Text. Box 2 ‘’ onserver. Validate = ‘’ Custom. Validator 2_Server. Validate ‘’ Display = ‘’Dynamic ‘’ Error. Message = ‘’VALIDATION DE DATE !’’ Fore. Color = ‘’Red’’ Text = ’’*’’ Set. Focus. On. Error = ‘’true ‘’/> Validation de la date : Validation. Expression =dd/dd

EXEMPLE 2 : Code Source Page 1. aspx <%@ Page Language="C#" Auto. Event. Wireup="true" Code. Behind="Page 1. aspx. cs" Inherits="Web. Application 1. Page 1" %> <!DOCTYPE html PUBLIC "-//W 3 C//DTD XHTML 1. 0 Transitional//EN" "http: //www. w 3. org/TR/xhtml 1/DTD/xhtml 1 -transitional. dtd"> <html xmlns="http: //www. w 3. org/1999/xhtml"> <head runat="server"> title></title> <script Language =‘’Java. Scrit’’> function Function. Client(Sender, e){ if(e. Value. Length<10){return e. Is. Valid=true ; } else{retrun e. Is. Valid= false ; }} </script></head> <body> <form id="form 1" runat="server">

<asp: Text. Box ID=‘’Text. Box 1’’ runat =‘’server ‘’ ></asp: Text. Box> <asp: Custom. Validator ID = ‘’CV 1 runat = ‘’server ‘’ Control. To. Validate = ‘’Text. Box 1 ‘’ onserver. Validate = ‘’ Custom. Validator 1_Server. Validate ‘’ Client. Validation. Function =‘’Function. Client’’/> </form> </body> </html>

§ Code Source Page. A. aspx : using System; using System. Collections. Generic; ////// namespace Web. Application 1{ public partial class Page 1 : System. Web. UI. Page {/// protected void Custom. Validator 1_Server. Validate(object source, Server. Validate. Event. Args args){ int x ; bool b= int. Try. Parse(e. Value, int x); if(!b){ e. Isvalid=false ; } esle if(x<10){ return e. Is. Valid = true ; } else }}}} { return e. Is. Valid = false ; }

VI-Validation. Summary : Ce contrôle n’est pas un contrôle de validation à proprement parler , il sert à afficher sous différents formes le résultat de tous les contrôles de validation sur la page. 1 -LES PROPRIETES : o Vous avez les Display. Mode suivants à votre disposition : § List : simple liste § Bullet. List : Liste à puces. § Simple. Paragraph : les messages d’erreur sont concaténés les uns à la suite des autres , séparés par une virgule. o Show. Summary : True dans une boite de dialogue. o Show. Message. Box : True dans une boite de dialogue. o Header. Text : texte affiché.

<asp: Validation. Summary ID = ‘’VS 1 runat = ‘’server ‘’ Display = ‘’List ‘’ Fore. Color = ‘’Red’’ Header. Text=‘’Veuillez corriger les erreurs suivantes : ‘’/> REMARQUE : [@#&%!=? +*-/]=W : qui correspond aux caractères non alphanumériques. Code. Behind C# : protected void button 1_Click(){ if(Page. Is. Valid){Label 1. Text=‘’Les données saisies sont valides Merci !’’; } LA PROPRIETE Is. Valid : permet d’indiquer si la validation de la page a réussi.

DEV-INFORMATIQUE MERCI POUR VOTRE ATTENTION