07 Avr2016
Validation d'un formulaire d'inscription simple
Objectifs:
- Valider des entrées utilisateur en ASP.NET.
- Utiliser les contrôles de validation RegularExpressionValidator et CompareValidator.
- Regrouper les messages d'erreur dans le contrôle Validationummary
- Ecrire des expressions régulières.
Énoncé:
Réaliser une page en ASP.Net qui permet de valider un formulaire d'inscription standard en utilisant les contrôles de validation.
Formulaire d'inscription
Les données saisies doivent respecter les contraintes suivantes:
- L'adresse électronique doit être au format email@hôte.domaine.
- Le mot de passe doit comprendre un de ces caractères: (@ # & % ! = ? + - * /)
- Les champs relatifs au mot de passe doivent être identiques
- Le code postal doit être constitué de 5 chiffres
- Le numéro de téléphone doit être au format : (XXX) XXX-XXXX
- Le numéro de carte de crédit doit contenir 16 chiffres
- La date d’expiration doit être au format : mm/aa
Si les contraintes ne sont pas vérifiées:
Formulaire d'inscription après validation
Validation du champ email:
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server"
ControlToValidate="TextBox2" ErrorMessage="Adresse électronique" ForeColor="Red"
ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"
Display="Dynamic">Adresse électronique non valide. Elle doit être au format email@hôte.domaine
</asp:RegularExpressionValidator>
Validation du champ Mot de passe: doit comprendre un de ces caractères (@ # & % ! = ? + - * /)
<asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server"
ControlToValidate="TextBox3" ErrorMessage="Mot de passe"
ForeColor="Red"
ValidationExpression=".*[@#&%!=?+*-/].*" Display="Dynamic">
Le mot de passe doit comprendre un de ces caractères: (@ # & % ! = ? + - * /)
</asp:RegularExpressionValidator>
Validation du champ de confirmation du mot de passe: vérifier la correspondance entre le mot de passe et sa confirmation
<asp:CompareValidator ID="CompareValidator1" runat="server"
ControlToCompare="TextBox3" ControlToValidate="TextBox4"
ErrorMessage="Entrez à nouveau le mot de passe" ForeColor="Red"
Display="Dynamic">Les champs relatifs au mot de passe diffèrent
</asp:CompareValidator>
Validation du champ Code postal: doit être constitué de 5 chiffres
<asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server"
ControlToValidate="TextBox10"
ErrorMessage="Code postal" ForeColor="Red"
ValidationExpression="\d{5}" Display="Dynamic" >
Le code postal doit être constitué de 5 chiffres
</asp:RegularExpressionValidator>
Validation du champ Téléphone: doit être au format (XXX) XXX-XXXX
<asp:RegularExpressionValidator ID="RegularExpressionValidator4" runat="server"
ControlToValidate="TextBox9" ErrorMessage="Téléphone"
ForeColor="Red" ValidationExpression="\(\d{3}\) \d{3}\-\d{4}"
Display="Dynamic">
Le numéro de téléphone doit être au format : (XXX) XXX-XXXX
</asp:RegularExpressionValidator>
Validation du champ Carte de crédit: doit contenir 16 chiffres
<asp:RegularExpressionValidator ID="RegularExpressionValidator5" runat="server"
ControlToValidate="TextBox11"
ErrorMessage="Numéro de carte de crédit"
ForeColor="Red" ValidationExpression="\d{16}" Display="Dynamic">
Numéro de carte de crédit non valide. Il doit contenir 16 chiffres
</asp:RegularExpressionValidator>
Validation du champ Date d’expiration: doit être au format mm/aa
<asp:RegularExpressionValidator ID="RegularExpressionValidator6" runat="server"
ControlToValidate="TextBox12"
ErrorMessage="Date d’expiration"
ForeColor="Red" ValidationExpression="\d\d/\d\d" Display="Dynamic">
La date d’expiration doit être au format mm/aa
</asp:RegularExpressionValidator>
Code de la page:
<form id="form1" runat="server" style="width:70%">
<div>
<asp:ValidationSummary ID="ValidationSummary1" runat="server" ForeColor="Red"
HeaderText="Vous devez entrer une valeur valide dans les champs ci-dessous: " />
</div>
<div>
<fieldset>
<legend>Informations de connexion</legend>
<table>
<tr>
<td class="style2" >
<asp:Label ID="Label1" runat="server" Text="Adresse électronique :" Width="180px"></asp:Label></td>
<td>
<asp:TextBox ID="TextBox2" runat="server" Width="285px"></asp:TextBox>
</td>
<td>
<asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server"
ControlToValidate="TextBox2" ErrorMessage="Adresse électronique" ForeColor="Red"
ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"
Display="Dynamic">
Adresse électronique non valide. Elle doit être au format email@hôte.domaine
</asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td class="style2">
<asp:Label ID="Label2" runat="server" Text="Mot de passe :" Width="180px"></asp:Label>:</td>
<td class="style4">
<asp:TextBox ID="TextBox3" runat="server" Width="286px" TextMode="Password"></asp:TextBox>
</td>
<td>
<asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server"
ControlToValidate="TextBox3" ErrorMessage="Mot de passe"
ForeColor="Red"
ValidationExpression=".*[@#&%!=?+*-/].*" Display="Dynamic">
Le mot de passe doit comprendre un de ces caractères: (@ # & % ! = ? + - * /)
</asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td class="style2"><asp:Label ID="Label3" runat="server" Text="Entrez à nouveau le mot de passe:"></asp:Label> </td>
<td class="style4">
<asp:TextBox ID="TextBox4" runat="server" Width="286px" TextMode="Password"></asp:TextBox>
</td>
<td>
<asp:CompareValidator ID="CompareValidator1" runat="server"
ControlToCompare="TextBox3" ControlToValidate="TextBox4"
ErrorMessage="Entrez à nouveau le mot de passe" ForeColor="Red"
Display="Dynamic">Les champs relatifs au mot de passe diffèrent
</asp:CompareValidator>
</td>
</tr>
</table>
</fieldset>
</div>
<br />
<br />
<div>
<fieldset>
<legend>Informations personnelles</legend>
<table>
<tr>
<td class="style3"><asp:Label ID="Label4" runat="server" Text="Prénom :"
Width="213px"></asp:Label></td>
<td><asp:TextBox ID="TextBox5" runat="server" style="margin-left: 1px" Width="286px"></asp:TextBox></td>
<td></td>
</tr>
<tr>
<td class="style3" ><asp:Label ID="Label5" runat="server" Text="Nom" Width="180px"></asp:Label></td>
<td><asp:TextBox ID="TextBox6" runat="server" Width="286px"></asp:TextBox></td>
<td></td>
</tr>
<tr>
<td class="style3"><asp:Label ID="Label6" runat="server" Text="Adresse" Width="180px"></asp:Label></td>
<td><asp:TextBox ID="TextBox7" runat="server" Width="286px"></asp:TextBox> </td>
<td></td>
</tr>
<tr>
<td class="style3"> <asp:Label ID="Label7" runat="server" Text="Etat" Width="180px"></asp:Label></td>
<td>
<asp:TextBox ID="TextBox8" runat="server" Width="54px"></asp:TextBox>
<asp:Label ID="Label9" runat="server" Text="Code postal:"></asp:Label>
<asp:TextBox ID="TextBox10" runat="server" Width="65px"></asp:TextBox>
</td>
<td>
<asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server"
ControlToValidate="TextBox10"
ErrorMessage="Code postal" ForeColor="Red"
ValidationExpression="\d{5}" Display="Dynamic" >
Le code postal doit être constitué de 5 chiffres
</asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td class="style3"><asp:Label ID="Label8" runat="server" Text="Téléphone" Width="180px"></asp:Label></td>
<td><asp:TextBox ID="TextBox9" runat="server" Width="286px"></asp:TextBox></td>
<td>
<asp:RegularExpressionValidator ID="RegularExpressionValidator4" runat="server"
ControlToValidate="TextBox9" ErrorMessage="Téléphone"
ForeColor="Red" ValidationExpression="\(\d{3}\) \d{3}\-\d{4}"
Display="Dynamic">
Le numéro de téléphone doit être au format : (XXX) XXX-XXXX
</asp:RegularExpressionValidator>
</td>
</tr>
</table>
</fieldset>
</div>
<br />
<br />
<div>
<fieldset>
<legend>Informations de carte de crédit</legend>
<table>
<tr>
<td class="style1"><asp:Label ID="Label10" runat="server" Text="Type de carte" Width="180px"></asp:Label></td>
<td >
<asp:RadioButton ID="RadioButton1" runat="server" Text="MasterCard" />
<br />
<asp:RadioButton ID="RadioButton2" runat="server" Text="Visa" />
</td>
<td></td>
</tr>
<tr>
<td class="style1"><asp:Label ID="Label11" runat="server" Text="Numéro de carte" Width="180px"></asp:Label></td>
<td><asp:TextBox ID="TextBox11" runat="server" Width="286px"></asp:TextBox></td>
<td>
<asp:RegularExpressionValidator ID="RegularExpressionValidator5" runat="server"
ControlToValidate="TextBox11"
ErrorMessage="Numéro de carte de crédit"
ForeColor="Red" ValidationExpression="\d{16}" Display="Dynamic">
Numéro de carte de crédit non valide. Il doit contenir 16 chiffres
</asp:RegularExpressionValidator>
</td>
</tr>
<tr>
<td class="style1"><asp:Label ID="Label12" runat="server" Text="Date d'expiration" Width="180px"></asp:Label></td>
<td><asp:TextBox ID="TextBox12" runat="server" Width="286px"></asp:TextBox> </td>
<td>
<asp:RegularExpressionValidator ID="RegularExpressionValidator6" runat="server"
ControlToValidate="TextBox12"
ErrorMessage="Date d’expiration"
ForeColor="Red" ValidationExpression="\d\d/\d\d" Display="Dynamic">
La date d’expiration doit être au format mm/aa
</asp:RegularExpressionValidator>
</td>
</tr>
</table>
</fieldset>
</div>
<br />
<div >
<asp:Button ID="Button1" runat="server" Text="Connexion" Height="33px"
Width="118px"/>
</div>
</form>
