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

JavaScript .

 ASP.NET fournit des contrôles de validation qui génèrent le code JavaScript associé ,

vous évitant de connaitre à fond le langage et de voir taper le code .

 Les principaux contrôles de validation sont :

RequiredFieledValidator RangeValidator

CompareValidator RegularExpressionValidator

CustomValidator Validation Summary

I-RequiredFieledValidator :

 a donc pour fonction de vérifier qu’un champs a été modifié .

1-LES PROPRIETES :
o ControlToValidate : doit contenir le nom du contrôle à valider .

o ErrorMessage : message à afficher en cas d’erreur .

o InitialValue : contient une valeur qui invalide le contrôle .
o Text : texte affiché en cas de non validation .
EXEMPLE :

<asp : TextBox ID = ‘’TextBox1 ‘’ runat = ‘’server ‘’ ></asp : TextBox>

<asp:RequiredFieledValidator ID = ‘’RFV1

runat = ‘’server ‘’

ControlToValidate = ‘’TextBox1 ‘’

Display = ‘’Dynamic ‘’

ErrorMessage = ‘’L’identifiant est obligatoire .’’

ForeColor = ‘’Red’’

Text = ’’*’’

SetFocusOnError = ‘’true ‘’>

</asp : RequiredFieledValidator>
II-RangeValidator :

 Il sera utilisé pour valider l’encodage entre des formes données .

1-LES PROPRIETES :
o ControlToValidate : doit contenir le nom du contrôle à valider .

o ErrorMessage : message à afficher en cas d’erreur .

o MinimumValue : valeur minimale de la plage de données .

o MaximumValue : valeur minimale de la plage de données .

o Text : texte affiché en cas de non validation .

EXEMPLE : de validation age doit etre entre1 et 10 :

<asp:Label ID = ‘’Label1 ‘’ runat =‘’server ‘’

Text = ‘’Entrez une valeur comprise entre 1 et 10 :‘’></asp:Label>

<asp:TextBox ID=‘’TextBox1’’ runat =‘’server ‘’ ></asp:TextBox>

<asp:RangeValidator ID = ‘’RV1

runat = ‘’server ‘’

ControlToValidate = ‘’TextBox1 ‘’

MaximumValue =‘’10 ’’

MinimunValue =‘’1’’

Display = ‘’Dynamic ‘’

ErrorMessage = ‘’Valeur entre 1 et 10’’

ForeColor = ‘’Red’’

Text = ’’*’’

SetFocusOnError = ‘’true ‘’>

</asp : RangeValidator>
III-CompareValidator :

 Il utilise un opérateur pour comparer les valeurs en présence et valider leur concordance

1-LES PROPRIETES :
o ControlToValidate : doit contenir le nom du contrôle à valider .

o ErrorMessage : message à afficher en cas d’erreur .

o InitialValue : contient une valeur qui invalide le contrôle .
o Text : texte affiché en cas de non validation .
2-1:COMPARAISON A UN TYPE :

<asp:TextBox ID=‘’TextBox1’’ runat =‘’server ‘’ ></asp:TextBox>

<asp:CompareValidator ID = ‘’CV1

runat = ‘’server ‘’

ControlToValidate = ‘’TextBox1 ‘’

Display = ‘’Dynamic ‘’

ErrorMessage = ‘’Doit etre un chiffre entier de type integer !’’

Type =‘’Integer ‘’

Operator =‘’DataTypeCheck ‘’

ForeColor = ‘’Red’’

Text = ’’*’’

SetFocusOnError = ‘’true ‘’>

</asp : CompareValidator>
2-2:COMPARAISON A UNE VALEUR :

<asp:TextBox ID=‘’TextBox1’’ runat =‘’server ‘’ ></asp:TextBox>

<asp:CompareValidator ID = ‘’CV1

runat = ‘’server ‘’

ValidateToCompare = ‘’TextBox1 ‘’

Display = ‘’Dynamic ‘’

ErrorMessage = ‘’Un chiffre positif est requis !’’

Type =‘’Integer ‘’

Operator =‘’GreaterThan ‘’

ForeColor = ‘’Red’’

Text = ’’*’’

SetFocusOnError = ‘’true ‘’>

</asp : CompareValidator>
2-3:COMPARAISON A UNE AUTRE CHAMPS : VALIDATION DE MOT DE PASSE :

<asp:TextBox ID=‘’TextBox1’’ runat =‘’server ‘’ ></asp:TextBox>

<asp:TextBox ID=‘’TextBox2’’ runat =‘’server ‘’ ></asp:TextBox>

(VOIR LA SUITE DE CODE )

<asp:CompareValidator ID = ‘’CV1

runat = ‘’server ‘’

ControlToCompare = ‘’TextBox1 ‘’

ControlToValidate =‘’TextBox2 ‘’

Display = ‘’Dynamic ‘’

ErrorMessage = ‘’Entrez à nouveau mot de passe !’’

Type =‘’String ‘’

Operator =‘’Equal ‘’

ForeColor = ‘’Red’’

Text = ’’*’’

SetFocusOnError = ‘’true ‘’>

</asp : CompareValidator>
IV-RegularExpressionValidator :

 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 ControlToValidate : doit contenir le nom du contrôle à valider .

o ErrorMessage : message à afficher en cas d’erreur .

o InitialValue : contient une valeur qui invalide le contrôle .
o Text : texte affiché en cas de non validation .
o ValidationExpression :

contient un modèle pour valider le texte saisi .

2-1: VALIDATION DU CHAMPS EMAIL :

<asp:TextBox ID=‘’TextBox1’’ runat =‘’server ‘’ ></asp:TextBox>

<asp:RegularExpressionValidator ID = ‘’REV1

runat = ‘’server ‘’

ControlToValidate = ‘’TextBox1 ‘’

Display = ‘’Dynamic ‘’

ErrorMessage = ‘’Adresse electronique !’’

ValidationExpression =‘’\W+([-+.’]\W+)*@\W+([-.]\W+.)*\.\W([-.]\W+) * ‘’

ForeColor = ‘’Red’’

Text = ’’*’’

SetFocusOnError = ‘’true ‘’>

Adresse Eléctronique</ asp:RegularExpressionValidator >

2-2: VALIDATION DE MOT DE PASSE :

<asp:TextBox ID=‘’TextBox2’’ runat =‘’server ‘’ ></asp:TextBox>

<asp:RegularExpressionValidator ID = ‘’REV2

runat = ‘’server ‘’

ControlToValidate = ‘’TextBox2 ‘’

Display = ‘’Dynamic ‘’

ErrorMessage = ‘’Mot de passe Incorrecte !’’

ValidationExpression =‘’.*[@#&%!=?+*-/].*‘’

ForeColor = ‘’Red’’

Text = ’’*’’

SetFocusOnError = ‘’true ‘’>

Format Incorrecte </ asp:RegularExpressionValidator >

2-3: VALIDATION DU CHAMP CODE POSTAL :

<asp:TextBox ID=‘’TextBox3’’ runat =‘’server ‘’ ></asp:TextBox>

<asp:RegularExpressionValidator ID = ‘’REV3

runat = ‘’server ‘’

ControlToValidate = ‘’TextBox3 ‘’

Display = ‘’Dynamic ‘’

ErrorMessage = ‘’Code Postal !’’

ValidationExpression =‘’\d{4}‘’

ForeColor = ‘’Red’’

Text = ’’*’’

SetFocusOnError = ‘’true ‘’>

Le code postal doit être constitué de 5 chiffres </ asp:RegularExpressionValidator >

2-4 : VALIDATION DU CHAMP TELEPHONE :

<asp:TextBox ID=‘’TextBox4’’ runat =‘’server ‘’ ></asp:TextBox>

<asp:RegularExpressionValidator ID = ‘’REV4

runat = ‘’server ‘’

ControlToValidate = ‘’TextBox4 ‘’

Display = ‘’Dynamic ‘’

ErrorMessage = ‘’TELEPHONE !’’

ValidationExpression =‘’\(\d{3}\)\d{3}\-\d{4}‘’

ForeColor = ‘’Red’’

Text = ’’*’’

SetFocusOnError = ‘’true ‘’>

Le numéro de téléphone doit être au format:(XXX)XXX-XXXX

</ asp:RegularExpressionValidator >

V-CustomValidator :

 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 : ClientValidateFunction : contient le nom de la fonction .

 La fonction doit être sous la forme : FunctionValidationPersonnelle(Source , Arguments )

o La source : est l’objet CustomValidator cote client .
o L’argument : est un objet comportant 2 propriétés : Value et IsValid
o La propriété Value : est la valeur à valider .
o La propriété IsValid : est un booléen retournent le résultat de la validation .

<sript Language=‘’JavaScript’’>

function Validation(obj, args){….}</script>

2-DANS LE COTE SEREVEUR : OnServereValidate

LES PROPRIETES DE CONTRÔLE : L’EVENEMENT DE CONTRÔLE :
EXEMPLE 1: VALIDATION DES DONNEES D’UNE CARTE DE CREDIT :

 Code Page1.aspx.cs

protected void CustomValidator1_ServerValidate(object source, ServerValidateEventArgs args)

{ //VALIDATION NUMERO DE CARTE

args.IsValid=(Regex.IsMatch(args.Value,’’^(51|52|44|55)’’)&&(args.Value.Length==16);

}
protected void CustomValidator2_ServerValidate(object source, ServerValidateEventArgs args)

{ //VALIDATION DATE D’expiration (mm/aaaa)

DateTime d ; bool valider = false ;

bool dateValide=DateTime.tryParseExact(args.Value,’’MM/YYYY’’,CultureInfo.InvariantCulture,

DateTimeStyles.None , out d ) ;

if(dateValide){

if(DateTime.Compare(d.AddMonths(1),DateTime.Now)>0){

valider=true; }

args.IsValid=valider ;

}
 Code Source PageA.aspx :

<asp:TextBox ID=‘’TextBox1’’ runat =‘’server ‘’ ></asp:TextBox>

<asp:CustomValidator ID = ‘’CV1

runat = ‘’server ‘’

ControlToValidate = ‘’TextBox1 ‘’

onserverValidate = ‘’ CustomValidator1_ServerValidate ‘’

Display = ‘’Dynamic ‘’

ErrorMessage = ‘’NUMERO DE CARTE CREDIT !’’

ForeColor = ‘’Red’’

Text = ’’*’’

SetFocusOnError = ‘’true ‘’/>

Le numéro de carte crédit incorrecte

<asp:TextBox ID=‘’TextBox2’’ runat =‘’server ‘’ ></asp:TextBox>

<asp:CustomValidator ID = ‘’CV2

runat = ‘’server ‘’

ControlToValidate = ‘’TextBox2 ‘’

onserverValidate = ‘’ CustomValidator2_ServerValidate ‘’

Display = ‘’Dynamic ‘’

ErrorMessage = ‘’VALIDATION DE DATE !’’

ForeColor = ‘’Red’’

Text = ’’*’’

SetFocusOnError = ‘’true ‘’/>

Validation de la date : ValidationExpression =\d\d/\d\d\d\d

EXEMPLE2 : Code Source Page1.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Page1.aspx.cs"

Inherits="WebApplication1.Page1" %>

<!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"> <head runat="server"> title></title>

<script Language =‘’JavaScrit’’>

function FunctionClient(Sender,e){

if(e.Value.Length<10){return e.IsValid=true ;}

else{retrun e.IsValid= false ; }}

</script></head>

<body>

<form id="form1" runat="server">

<asp:TextBox ID=‘’TextBox1’’ runat =‘’server ‘’ ></asp:TextBox>

<asp:CustomValidator ID = ‘’CV1

runat = ‘’server ‘’

ControlToValidate = ‘’TextBox1 ‘’

onserverValidate = ‘’ CustomValidator1_ServerValidate ‘’

ClientValidationFunction =‘’FunctionClient’’/>

</form>

</body>

</html>
 Code Source PageA.aspx :

using System;

using System.Collections.Generic;

//////

namespace WebApplication1{

public partial class Page1 : System.Web.UI.Page {///

protected void CustomValidator1_ServerValidate(object source,

ServerValidateEventArgs args){

int x ; bool b= int.TryParse(e.Value,int x);

if(!b){ e.Isvalid=false ;}

esle if(x<10){ return e.IsValid = true ;}

else { return e.IsValid = false ;}

}}}}
VI-ValidationSummary :

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 DisplayMode suivants à votre disposition :
 List : simple liste
 BulletList : Liste à puces .
 SimpleParagraph : les messages d’erreur sont concaténés les uns à la suite des
autres , séparés par une virgule .
o ShowSummary : True dans une boite de dialogue .
o ShowMessageBox : True dans une boite de dialogue .

o HeaderText : texte affiché .

<asp:ValidationSummary ID = ‘’VS1

runat = ‘’server ‘’

Display = ‘’List ‘’

ForeColor = ‘’Red’’

HeaderText=‘’Veuillez corriger les erreurs suivantes :‘’/>

REMARQUE :

[@#&%!=?+*-/]=\W : qui correspond aux caractères non alphanumériques .

CodeBehind C# :

protected void button1_Click(){

if(Page.IsValid){Label1.Text=‘’Les données saisies sont valides Merci !’’;}

LA PROPRIETE IsValid : permet d’indiquer si la validation de la page a réussi .

DEV-INFORMATIQUE
MERCI POUR VOTRE
ATTENTION