Per validare e controllare il valore dei dati inseriti in un form, a volte, vengono usate complesse funzioni JavaScript su ogni campo. In questo articolo, prendiamo in esame i controlli di validazione messi a disposizione da ASP.NET.
La classe BaseValidator
Per prima cosa dobbiamo dire che grazie ai controlli di validazione forniti da ASP.NET è semplice ottenere delle Label destinate a visualizzare messaggi di errore e che tutti i controlli validator ereditano dalla classe BaseValidator che a sua volta eredita, nemmeno a farlo apposta dalla stessa classe Label.
A ciascun controllo di input o di selezione possono essere associati uno o più "validatori". Potremmo, ad esempio, aver bisogno di controllare in un particolare campo, la presenza di dati e la loro correttezza.
Ogni controllo validator espone una proprietà isValid di tipo booleano, che indica se i dati ineriti nel controllo associato sono o meno validi ovvero se rispettano o meno le regole che vi abbiamo imposto.
I controlli di validazione messi a disposizione da ASP.NET sono principalmente 6:
- RequiredFieldValidator,
- CompareValidator,
- RangeValidator,
- RegularExpressionValidator,
- CustomValidator,
- ValidationSummary.
Con questa collezione di controlli possiamo verificare i dati praticamente in tutte le casistiche. Dalla richiesta di un semplice inserimento di valori, alla verifica tramite espressioni regolari. Li esaminiamo uno ad uno.
RequiredFieldValidator
Questo controllo viene utilizzato per verificare che sia avvenuto l'inserimento nel controllo associato. Se quest'ultimo risulta vuoto apparirà il messaggio di errore.
Listato 1. Validazione di una TextBox
<!-- Controllo associato -->
<asp:TextBox id="TextBox1" runat="server"></asp:TextBox>
<!-- Validatore -->
<asp:RequiredFieldValidator id="Validatore" runat="server"
ControlToValidate="TextBox1"
ErrorMessage="Inserire un valore">
</asp:RequiredFieldValidator>
Abbiamo inserito una casella di testo generica ed un controllo di validazione. Nel controllo di validazione abbiamo definito il controllo da validare (ControlToValidate) ed il messaggio di errore (ErrorMessage). Nel caso in cui l'utente lasci vuota la casella di testo, apparirà il messagdio di errore e la pagina non effettuerà il POST dei dati.
CompareValidator
Questo validatore serve per la comparazione del valore immesso nel controllo da convalidare, con un termine di paragone. Il termine di paragone può essere un valore fisso oppure un valore preso da un ulteriore controllo. Inoltre è possibile decidere la regole di confronto tra i valori (uguale, maggiore, minore, etc.). Se il confronto ha esito negativo, sarà visualizzato un messaggio di errore.
Listato 2. Convalidare l'inserimento di una password
<asp:TextBox id="txtPassword" runat="server"></asp:TextBox>
<br />
<asp:TextBox id="txtVerificaPassword" runat="server"></asp:TextBox>
<asp:CompareValidator id="Confronta" runat="server"
ControlToCompare="txtPassword"
ControlToValidate="txtVerificaPassword"
Operator="Equal"
ErrorMessage="Le password devono essere uguali.">
</asp:CompareValidator>
In questo esempio abbiamo un form con un campo Password ed uno di verifica. Se l'utente inserisce nel campo di verifica una password diversa da quella del primo campo, riceverà l'errore. Nella proprietà ValueToCompare sia nel tag sia a codice, definiamo il termine di paragone.
Esiste inoltre un ultimo attributo chiamato Type che prende valori dall'enumerazione ValidationDataType. Con questo attributo sarà possibile definire il tipo di dato da associare ai valori per il confronto.
RangeValidator
Questo validatore verifica che il dato sia compreso in un intervallo di valori. Ad esempio possiamo verificare che l'anno immesso in una casella di testo sia compreso tra il 1990 e l'anno corrente.
Listato 3. Verifica sulla data
<asp:TextBox id="txtAnno" runat="server"></asp:TextBox>
<asp:CompareValidator id="Comparatore" runat="server"
ControlToValidate="txtAnno"
ErrorMessage="Inserire un anno dal 1990 al 2006"
MaximumValue="2006" MinimumValue="1990"
Type="Integer">
</asp:CompareValidator>
Come mostrato nel codice questo controllo necessita di un valore minimo (MaximumValue) e di un valore massimo (Minimum Value) da poter controllare. Inoltre dobbiamo, anche qui, specificare il tipo di dato che deve essere controllato (Type).
RegularExpressionValidator
Il controllo in questione effettua una verifica tramite espressioni regolari sul contenuto. Le espressioni regolari, in questo caso, definiscono i modelli (pattern) di stringa ai quali bisogna attenersi. Ad esempio un indirizzo E-Mail deve contenere una prima sottostringa poi un carattere chiocciola '@', una seconda sottostringa, un punto ed infine un massimo di 4 caratteri che identificano il dominio. In una espressione regolare possiamo creare il modello, il formato di questa stringa e farlo verificare dal nostro validatore.
Listato 4. Convalidare un indirizzo di posta
<asp:TextBox id="Email" runat="server"></asp:TextBox>
<asp:RegulaExpressionValidator id="RegEx" runat="server"
ControlToValidate="Email"
ErrorMessage="E-Mail non valida!"
ValidationExpression="w+([-+.']w+)*@w+([-.]w+)*.w+([-.]w+)*" >
</asp:RegularExpressionValidator>
CustomValidator
Questo controllo di validazione è il più flessibile e deve essere utilizzato ogni qual volta non si possono usare gli altri validatori o le regole di validazione sono personalizzate. Dobbiamo ricordare che i controlli come TextBox ad esempio, detengono una proprietà ValidationProperty che gli consente di interagire con i validatori, cosa che invece una CheckBox non possiede.
Anche in questo caso andremo ad usare un validatore personalizzato. Inoltre con i controlli personalizzati di validazione possiamo anche specificare una funzione Javascript personalizzata. Vediamo un paio di esempi.
Listato 5. CustomValidator con funzione Javascript
<asp:CustomValidator id="CusVal" runat="server"
ErrorMessage="Messaggio di errore"
ControlToValidate="txtTesto" ValidateEmptyText="true"
ClientValidationFunction="ControllaCodice" >
</asp:CustomValidator>
Listato 6. Funzione JavaScript
<script type="Text/Javascript">
function ControllaCodice(source, args){
if (/*... condizione ... */){
args.isValid = false;
}else{
args.isValid = true;
}
}
L'unico fattore di cui dobbiamo tenere conto è la firma della funzione. In altre parole dobbiamo sempre inserire source ovvero il controllo da validare e args, gli argomenti che accetta il validatore, in questo caso stiamo dicendo se il controllo sia valido o meno. Con questo controllo abbiamo piena gestione della validazione di tutti i controlli, quali CheckBox, Liste, Combo e quant'altro.
Riassumere gli errori, ValidationSummary
L'ultimo controllo che dobbiamo analizzare è il ValidationSummary, ovvero quel controllo che riassume tutti i messaggi di errore dei controlli validator presenti nella pagina. Questo controllo offre due modalità di visualizzazione degli errori: possiamo elencare gli errori in una lista posta ai piedi del form, oppure possiamo far apparire una finestra di alert con elencati i messaggi di errore.
Listato 7. ValidationSummary
<asp:ValidationSummary id="Sum" runat="server"
HeaderText="Titolo" ShowMessageBox="true" >
</asp:ValidationSummary>
Il controllo sommario ci chiede se vogliamo visualizzare una finestra di Alert (ShowMessageBox), Il valore ErrorMessage di un controllo validator viene visualizzato all' interno di un ValidationSummary, se presente, mentre il valore Text del controllo validator prende il posto di ErrorMessage se è presente un ValidationSummary.
Riassumendo, se vogliamo visualizzare un elenco di errori, basterà impostare la stringa di errore solamente per l'attributo ErrorMessage, al contrario se vogliamo visualizzare, in presenza di un ValidationSummary, anche un mesaggio di fianco ad ogni controllo, dovremo interagire con l'attributo Text dei singoli validatori.
Conclusioni
Grazie alla presenza di questi controlli, la validazione dei dati risulta veloce e flessibile, ma non dobbiamo chiudere JavaScript in un cassetto perchè come dimostrato nel CustomValidator, può sempre tornarci utile.
