ASP.NET - Validazione

ASP.NET

Validazione

I controlli di validazione servono per assicurare che i dati inseriti dall’utente in certi controlli, siano validi.
Questi controlli sono quindi dei ‘messaggi’ da mettere accanto ai controlli da validare. Se l’utente immette un valore non valido nel controllo, allora il messaggio diventa visibile. Tipicamente i controlli sui quali fare la validazione sono la TextBox e la DropDownList.

Ci sono diversi controlli di validazione:

- RequiredFieldValidator

- RangeValidator

- CompareValidator

- RegularExpressionValidator

- CustomValidator

- ValidationSummary

Essi sono presenti nella Toolbox in una sezione separata:

I controlli di validazione eseguono la validazione sia lato Client che lato Server. La validazione lato Client è eseguita tramite codice JavaScript generato automaticamente da ASP.NET. Il programmatore generalmente non deve aggiungere altro codice, almeno nei casi più utilizzati.
Nel caso che l’utente abbia disabilitato l’esecuzione di script JavaScript, la validazione avviene ugualmente però solo sul lato Server.

Proprietà comuni ai controlli

ControlToValidate: è l’ID del controllo da validare.
SetFocusOnError: imposta il Focus al controllo che non passa la validazione.
EnableClientScript: abilita / disabilita la validazione lato Client, default è true.
Enabled: abilita / disabilita la validazione, default è true, ma può essere utile per qualche motivo non validare un controllo.
ErrorMessage: è il messaggio di errore da mostrare in caso di validazione non soddisfatta.
Text: è come la proprietà ‘ErrorMessage’, cioè il messaggio da mostrare in caso di validazione non soddisfatta. Se impostata, la proprietà ‘Text’ è prioritaria rispetto alla proprietà ‘ErrorMessage’. Questa proprietà è utilizzata con il controllo di validazione ValidationSummary (descritto dopo). In pratica se si devono validare molti controlli, conviene impostare la proprietà ‘Text’ con il carattere ‘*’ (asterisco) a tutti i controlli di validazione. I controlli che non superano la validazione, mostrano solo un ‘*’ a lato, mentre tutti i messaggi di errore sono raggruppati tramite il ValidationSummary.
Display: a un controllo possono essere associate più validazioni, ognuna con un messaggio specifico. Per far sì che gli eventuali messaggi non visibili, non occupino uno spazio che sarebbe ‘vuoto’, basta impostare questa proprietà a ‘Dynamic’. In questo modo i messaggi delle validazioni ‘visibili’ sono uno vicino all’altro e soprattutto vicino al controllo. La proprietà può essere impostata anche a ‘Static’ (lo spazio del messaggio è sempre occupato dal controllo) e ‘None’ (il messaggio non viene mostrato, utile con il controllo ValidationSummary).

Nota

Se durante l’esecuzione degli esempi successivi, si ha l’errore: "WebForms UnobtrusiveValidationMode richiede un oggetto ScriptResourceMapping per 'jquery'. Aggiungere un oggetto ScriptResourceMapping denominato jquery (distinzione tra maiuscole e minuscole)." significa che ASP.NET vorrebbe inserire del codice ‘jquery’ all’interno della pagina, invece di inserire del codice ‘JavaScript’. Ma ASP.NET non sa dove sia il jquery. Perciò bisogna forzare ASP.NET all’utilizzo del JavaScript e per farlo basta inserire nel file ‘Web.config’ le seguenti righe:

<appSettings>
<add key="ValidationSettings:UnobtrusiveValidationMode" value="None"/>
</appSettings>

RequiredFieldValidator

Se il controllo RequiredFieldValidator è associato al controllo TextBox, mostra il messaggio se l’utente non inserisce alcun dato nella TextBox.
Se il controllo RequiredFieldValidator è associato al controllo DropDownList, mostra il messaggio se l’utente non seleziona un item valido (o in altre parole, se l’utente seleziona o lascia selezionato l’item considerato ‘iniziale’).

Esempio con una TextBox

Design:

Codice HTML:

<asp:TextBox ID="txtInput" runat="server"></asp:TextBox>
 <asp:RequiredFieldValidator ID="rfvTxtInput" runat="server"
 ControlToValidate="txtInput"
 ErrorMessage="Dato obbligatorio"
 ForeColor="Red">
 </asp:RequiredFieldValidator>
 
 <asp:Button ID="btnOk" runat="server" Text="OK" OnClick="btnOk_Click" />

Esempio con una DropDownList

Design:

Codice HTML:

<asp:DropDownList ID="ddlInput" runat="server">
 <asp:ListItem Text="(Seleziona un valore)" Value="-1" />
 <asp:ListItem Text="Primo" Value="1" />
 <asp:ListItem Text="Secondo" Value="2" />
 <asp:ListItem Text="Terzo" Value="3" />
 </asp:DropDownList>
 <asp:RequiredFieldValidator ID="rfvDdlInput" runat="server"
 ControlToValidate="ddlInput"
 InitialValue="-1"
 ErrorMessage="Scelta obbligatoria"
 ForeColor="Red">
 </asp:RequiredFieldValidator>
 
 <asp:Button ID="btnOk" runat="server" Text="OK" OnClick="btnOk_Click" />

Notare la proprietà ‘InitialValue’ necessaria per impostare l’item che si considera come selezione non valida.

RangeValidator

Il controllo RangeValidator è associato al controllo TextBox e mostra il messaggio se l’utente non inserisce un valore all’interno di un dato range, nella TextBox.
Attenzione: se l’utente non inserisce alcun valore, il RangeValidator non dà errore. Perciò occorre inserire anche un RequiredFieldValidator se si necessita che l’utente inserisca sempre un valore (E si ricordi della proprietà ‘Display’).

Esempio con un range numerico

Design:

Codice HTML:

<asp:TextBox ID="txtInput" runat="server"></asp:TextBox>
 <asp:RangeValidator ID="rnvTxtInput" runat="server"
 ErrorMessage="Il valore deve essere compreso tra 1 e 100"
 ControlToValidate="txtInput"
 MinimumValue="1"
 MaximumValue="100"
 Type="Integer"
 ForeColor="Red">
 </asp:RangeValidator>
 
 <asp:Button ID="btnOk" runat="server" Text="OK" OnClick="btnOk_Click" />

Esempio con un range di date

Design:

Codice HTML:

<asp:TextBox ID="txtInput" runat="server"></asp:TextBox>
 <asp:RangeValidator ID="rnvTxtInput" runat="server"
 ErrorMessage="La data deve essere compresa tra il '01/01/2001' e il '31/01/2001'."
 ControlToValidate="txtInput"
 MinimumValue="01/01/2001"
 MaximumValue="31/01/2001"
 Type="Date"
 ForeColor="Red">
 </asp:RangeValidator>
 
 <asp:Button ID="btnOk" runat="server" Text="OK" OnClick="btnOk_Click" />

CompareValidator

Il controllo CompareValidator è associato a uno o due controlli TextBox. Esso può essere utilizzato in diversi modi:

- Confronto fra i valori di due controlli TextBox.

- Controllo del valore inserito in una TextBox con un valore costante.

- Controllo del tipo di dato inserito in una TextBox.

Esempio di confronto tra due TextBox

Si può confrontare il valore inserito nelle due TextBox (caso tipico quando ci si registra inserendo la password due volte).
Attenzione che se nella seconda TextBox non si inserisce alcun valore, il controllo non dà alcun errore (quindi bisogna inserire anche un RequiredFieldValidator).
Con la proprietà ‘Operator’ si specifica l’operatore di confronto: ‘Equal’, ‘NotEqual’, ‘GreaterThan’, ‘GreaterThanEqual’, ‘LessThan’ e ‘LessThanEqual’.
Con la proprietà ‘Type’ si specifica il tipo di dato: ‘Currency’, ‘Date’, ‘Double’, ‘Integer’, ‘String’.
Design:

Codice HTML:

<asp:TextBox ID="txtInput1" runat="server"></asp:TextBox>
 
 <asp:TextBox ID="txtInput2" runat="server"></asp:TextBox>
 <asp:CompareValidator ID="cmvTxtInput" runat="server"
 ErrorMessage="Le due TextBox devono avere lo stesso valore."
 ControlToValidate="txtInput2"
 ControlToCompare="txtInput1"
 Operator="Equal"
 Type="String"
 ForeColor="Red">
 </asp:CompareValidator>
 
 <asp:Button ID="btnOk" runat="server" Text="OK" OnClick="btnOk_Click" />

Esempio di confronto tra una TextBox e una costante

Si può confrontare il valore inserito in una TextBox e un valore costante.
Attenzione che se nella TextBox non si inserisce alcun valore, il controllo non dà alcun errore (quindi bisogna inserire anche un RequiredFieldValidator).
Con la proprietà ‘Operator’ si specifica l’operatore di confronto: ‘Equal’, ‘NotEqual’, ‘GreaterThan’, ‘GreaterThanEqual’, ‘LessThan’ e ‘LessThanEqual’.
Con la proprietà ‘Type’ si specifica il tipo di dato: ‘Currency’, ‘Date’, ‘Double’, ‘Integer’, ‘String’.
Design:

Codice HTML:

<asp:TextBox ID="txtInputDate" runat="server"></asp:TextBox>
 <asp:CompareValidator ID="cmvTxtInput" runat="server"
 ErrorMessage="La data inserita deve essere maggiore o uguale al '01/01/2001'."
 ControlToValidate="txtInputDate"
 ValueToCompare="01/01/2001"
 Operator="GreaterThanEqual"
 Type="Date"
 ForeColor="Red">
 </asp:CompareValidator>
 
 <asp:Button ID="btnOk" runat="server" Text="OK" OnClick="btnOk_Click" />

Esempio di controllo del tipo inserito in una TextBox

Si può controllare che il valore inserito in una TextBox sia di un certo tipo.
Attenzione che se nella TextBox non si inserisce alcun valore, il controllo non dà alcun errore (quindi bisogna inserire anche un RequiredFieldValidator).
Con la proprietà ‘Operator’ si specifica l’operatore ‘DataTypeCheck’.
Con la proprietà ‘Type’ si specifica il tipo di dato: ‘Currency’, ‘Date’, ‘Double’, ‘Integer’, ‘String’.
Design:

Codice HTML:

<asp:TextBox ID="txtInputDate" runat="server"></asp:TextBox>
 <asp:CompareValidator ID="cmvTxtInput" runat="server"
 ErrorMessage="Il valore inserito deve essere una Data."
 ControlToValidate="txtInputDate"
 Operator="DataTypeCheck"
 Type="Date"
 ForeColor="Red">
 </asp:CompareValidator>
 
 <asp:Button ID="btnOk" runat="server" Text="OK" OnClick="btnOk_Click" />

RegularExpressionValidator

Il controllo RegularExpressionValidator è associato al controllo TextBox e mostra il messaggio se l’utente non inserisce un valore nella TextBox secondo il formato previsto dalla Regular Expression.
Attenzione che se nella TextBox non si inserisce alcun valore, il controllo non dà alcun errore (quindi bisogna inserire anche un RequiredFieldValidator).
Questo controllo è molto potente purché si sappia scrivere le Regular Expression, anche se l’ambiente di sviluppo dà un importante aiuto: nel pannello delle proprietà del controllo, la proprietà ‘ValidationExpression’ presenta un menu con delle Regular Expression già preimpostate. Un classico utilizzo è nell’immissione di indirizzi e-mail.

Esempio di controllo di una e-mail

Design:

Codice HTML:

<asp:TextBox ID="txtEmail" runat="server"></asp:TextBox>
 <asp:RegularExpressionValidator ID="revTxtEmail" runat="server"
 ErrorMessage="Il valore inserito non è una e-mail."
 ControlToValidate="txtEmail"
 ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"
 ForeColor="Red">
 </asp:RegularExpressionValidator>
 
 <asp:Button ID="btnOk" runat="server" Text="OK" OnClick="btnOk_Click" />

CustomValidator

Il controllo CustomValidator è associato al controllo TextBox e mostra il messaggio se l’utente non inserisce un valore nella TextBox secondo un metodo che deve scrivere il programmatore.
Diversamente dagli altri controlli di validazione, a questo controllo può essere richiesto da validare il contenuto anche se vuoto.
Questo controllo è molto potente perché si può scrivere un qualunque metodo di validazione lato Server (e possibilmente anche quello lato Client, anche se non è obbligatorio).
Con la proprietà ‘OnServerValidate’ si aggancia l’evento per la validazione lato Server. Questo evento ha il parametro ‘args’ con la proprietà ‘Value’ che contiene il valore da validare e la proprietà ‘IsValid’ che è il valore da restituire (true o false).
Con la proprietà ‘ClientValidationFunction’ si aggancia la funzione per la validazione lato Client. Questa funzione è una funzione JavaScript.

Esempio di controllo inserimento di un numero pari

Design:

Codice HTML:

<asp:TextBox ID="txtInput" runat="server"></asp:TextBox>
 <asp:CustomValidator ID="csvTxtInput" runat="server"
 ErrorMessage="Il numero inserito non è pari."
 ControlToValidate="txtInput"
 OnServerValidate="csvTxtInput_ServerValidate"
 ClientValidationFunction="IsEven"
 ValidateEmptyText="true"
 ForeColor="Red">
 </asp:CustomValidator>
 
 <asp:Button ID="btnOk" runat="server" Text="OK" OnClick="btnOk_Click" />

Codice C#:

   protected void csvTxtInput_ServerValidate(object source, ServerValidateEventArgs args)
   {
       // Prova a convertire in 'int'
       int num;
       bool isNumeric = int.TryParse(args.Value, out num);

       // Se convertito in 'int' ed è pari, allora validazione OK.
       if (isNumeric && num % 2 == 0)
           args.IsValid = true;
       else
           args.IsValid = false;
       }

Codice Javascript (da inserire quindi nel tag <head> della pagina):

Il controllo ValidationSummary riassume tutti i messaggi di validazione in un unico posto. A fianco dei controlli che non hanno superato la validazione, si fa tipicamente apparire un testo configurabile (per esempio ‘*’). In questo modo l’utente può correggere più errori di input in un’unica sessione.
Per ogni controllo della WebForm, bisogna impostare sia la proprietà ‘ErrorMessage’ (il cui valore compare poi nel ValidationSummary) che la proprietà ‘Text’ (il cui valore appare a fianco del controllo).
La proprietà ‘HeaderText’ permette di impostare una intestazione al controllo.
Con la proprietà ‘ShowSummary’ (default è true) si imposta un bool per mostrare il testo delle validazioni non passate. Se si imposta la proprietà ‘ShowMessageBox’ a true, il messaggio riassuntivo appare in una finestra separata (non molto utilizzato).

Esempio con tre TextBox

Design:

Codice HTML:

<asp:TextBox ID="txtInput1" runat="server"></asp:TextBox>
 <asp:RequiredFieldValidator ID="rfvTxtInput1" runat="server"
 ControlToValidate="txtInput1"
 ErrorMessage="Inserire il valore"
 ForeColor="Red"
 Text="*">
 </asp:RequiredFieldValidator>
 
 <asp:TextBox ID="txtInput2" runat="server"></asp:TextBox>
 <asp:RequiredFieldValidator ID="rfvTxtInput2" runat="server"
 ControlToValidate="txtInput2"
 ErrorMessage="Inserire il valore"
 ForeColor="Red"
 Text="*">
 </asp:RequiredFieldValidator>
 
 <asp:TextBox ID="txtInput3" runat="server"></asp:TextBox>
 <asp:RequiredFieldValidator ID="rfvTxtInput3" runat="server"
 ControlToValidate="txtInput3"
 ErrorMessage="Inserire il valore"
 ForeColor="Red"
 Text="*">
 </asp:RequiredFieldValidator>
 
 <asp:Button ID="btnOk" runat="server" Text="OK" OnClick="btnOk_Click" />
 
 
 <asp:ValidationSummary ID="vlsGlobale" runat="server"
 HeaderText="Riassunto degli errori"
 ForeColor="Red"
 DisplayMode="List" />

Gruppi di validazione

La validazione avviene di default per tutti i controlli nella WebForm.
In alcune situazione si vuole che un bottone faccia la validazione di alcuni controlli, mentre un altro bottone faccia la validazione per altri controlli. Questo lo si può ottenere con la proprietà ‘ValidationGroup’. Essa va impostata sia ai controlli da validare che al bottone che fa la validazione. Stringhe diverse, rappresentano gruppi di validazione diversi.

Esempio con input in due fasi

Design:

Codice HTML:

<asp:TextBox ID="txtInput1" runat="server"></asp:TextBox>
 <asp:RequiredFieldValidator ID="rfvTxtInput1" runat="server"
 ControlToValidate="txtInput1"
 ErrorMessage="Inserire il valore"
 ForeColor="Red"
 ValidationGroup="Group1">
 </asp:RequiredFieldValidator>
 
 <asp:TextBox ID="txtInput2" runat="server"></asp:TextBox>
 <asp:RequiredFieldValidator ID="rfvTxtInput2" runat="server"
 ControlToValidate="txtInput2"
 ErrorMessage="Inserire il valore"
 ForeColor="Red"
 ValidationGroup="Group1">
 </asp:RequiredFieldValidator>
 
 <asp:Button ID="btnOkFase1" runat="server" Text="OK fase 1" ValidationGroup="Group1" />
 
 
 <asp:TextBox ID="txtInput3" runat="server"></asp:TextBox>
 <asp:RequiredFieldValidator ID="rfvTxtInput3" runat="server"
 ControlToValidate="txtInput3"
 ErrorMessage="Inserire il valore"
 ForeColor="Red"
 ValidationGroup="Group2">
 </asp:RequiredFieldValidator>
 
 <asp:TextBox ID="txtInput4" runat="server"></asp:TextBox>
 <asp:RequiredFieldValidator ID="rfvTxtInput4" runat="server"
 ControlToValidate="txtInput4"
 ErrorMessage="Inserire il valore"
 ForeColor="Red"
 ValidationGroup="Group2">
 </asp:RequiredFieldValidator>
 
 <asp:Button ID="btnOkFase2" runat="server" Text="OK fase 2" ValidationGroup="Group2" />

Impedire la validazione

In certi casi si vuole fare in modo che cliccando in certi bottoni, non avvenga la validazione. Per esempio se si ha una WebForm con alcuni campi di input e i bottoni ‘Invia’ e ‘Cancella’, si vuola che la validazione avvenga solo alla pressione del bottono ‘Invia’, mentre se l’utente clicca sul bottone ‘Cancella’ il campi devono essere inizializzati nuovamente.
Per ottenere questo risultato basta impostare la proprietà CauseValidation="false" per il bottone ‘Cancella’.

Controllare lo stato di validazione

La validazione avviene sia lato Client, sia lato Server. Un utente può impedire la validazione lato Client disabilitando nel Browser, l’esecuzione di codice JavaScript. In questo caso la validazione avviene solo nel lato Server.
Nel bottone che fa il Post della pagina, bisogna controllare lo stato della validazione, perché il codice C# deve essere eseguito solo se la validazione dei controlli ha dato esito positivo.
Per fare questo, c’è la proprietà ‘IsValid’ della pagina.

   protected void btnOk_Click(object sender, EventArgs e)
   {
       if (Page.IsValid)
       {
           // Codice da eseguire solo se la validazione è passata.
       }
   }

È molto importante questa proprietà, perché un utente potrebbe disabilitare l’esecuzione di codice JavaScript e visualizzare i messaggi delle validazioni non passate (dovute al controllo lato Server). Senza la condizione 'IsValid' il codice sarebbe eseguito lo stesso.