Condividi tramite


Procedura dettagliata: convalida dell'input dell'utente in una pagina Web Form

Aggiornamento: novembre 2007

In questa procedura dettagliata viene illustrato come utilizzare i controlli di convalida ASP.NET per verificare l'input dell'utente in una pagina Web. Saranno utilizzati alcuni controlli che consentono l'esecuzione di tutte le verifiche in modo automatico, senza richiedere alcun codice. Inoltre, verrà creata una convalida personalizzata che prevede la scrittura di un codice, nella quale viene illustrato come aggiungere la logica personalizzata al framework di convalida nella pagina. Infine, verrà descritto come convalidare l'input dell'utente in modo condizionale, in base alle scelte effettuate nella pagina.

Nella procedura dettagliata verrà creata una pagina per un sito Web che consente di richiedere una prenotazione. Dal momento che lo scopo della procedura dettagliata è illustrare la convalida, il tipo di prenotazione (ad esempio se si tratta di una prenotazione per un ristorante o per una sala riunioni di un centro ricreativo) non è importante. Inoltre, la pagina in realtà non elabora la prenotazione.

Nella pagina creata verrà richiesto all'utente un indirizzo di posta elettronica, il numero di persone per cui prenotare e la data desiderata. Inoltre, nella pagina sarà possibile richiedere una conferma telefonica della prenotazione. L'impostazione predefinita per questa pagina, se implementata, sarebbe una conferma tramite posta elettronica.

Nota sulla sicurezza:

Per impostazione predefinita, la pagina Web Form verifica automaticamente il tentativo, da parte di utenti non autorizzati, di inviare script all'applicazione. Per ulteriori informazioni, vedere Cenni preliminari sugli attacchi tramite script.

In particolare, vengono illustrate le seguenti operazioni:

  • Utilizzo dei controlli di convalida per verificare l'input dell'utente in una pagina Web ASP.NET.

  • Formattazione della visualizzazione dei messaggi di errore relativi alla convalida.

  • Creazione della convalida personalizzata mediante la scrittura di codice.

Prerequisiti

Per completare questa procedura dettagliata è necessario:

  • Visual Studio e .NET Framework.

Creazione del sito e della pagina Web

Nella prima parte della procedura dettagliata saranno creati un sito e una pagina Web in cui è possibile utilizzare gli stili.

Se in Visual Studio è già stato creato un sito Web (ad esempio, utilizzando l'argomento Procedura dettagliata: creazione di una pagina Web di base in Visual Web Developer ), è possibile utilizzare quel sito Web e passare alla sezione "Aggiunta di controlli" più avanti nella procedura dettagliata. In caso contrario, creare un sito e una pagina Web nuovi attenendosi alla procedura riportata di seguito.

Per creare un sito Web di file system

  1. Aprire Visual Studio.

  2. Scegliere Nuovosito Web dal menu File.

    Verrà visualizzata la finestra di dialogo Nuovo sito Web.

  3. Nell'elenco Linguaggio scegliere il linguaggio di programmazione con lui lavorare.

    Il linguaggio di programmazione scelto sarà il linguaggio predefinito per il sito Web, ma è possibile impostare i linguaggi di programmazione per ogni singola pagina.

  4. In Modelli Visual Studio installati fare clic su Sito Web ASP.NET.

  5. Nella casella Percorso, immettere il nome della cartella in cui salvare le pagine del sito Web.

    Digitare, ad esempio, il nome di cartella C:\WebSites.

  6. Scegliere OK.

    Visual Studio crea la cartella e una nuova pagina chiamata Default.aspx.

Aggiunta di controlli

Saranno utilizzati soltanto alcuni controlli per eseguire la richiesta delle informazioni necessarie per la prenotazione.

Per aggiungere i controlli e il testo

  1. Passare alla visualizzazione Progettazione.

  2. Digitare un'intestazione di pagina, ad esempio Submit a Reservation.

  3. Dal gruppo Standard della Casella degli strumenti, trascinare i seguenti controlli nella pagina e impostare le relative proprietà come riportato di seguito.

    1. Controllo

    1. Proprietà

    TextBox

    ID: textEmail

    TextBox

    ID: textNumberInParty

    TextBox

    ID: textPreferredDate

    Button

    ID: buttonSubmit

    Text: Submit Request

    ValidationGroup: AllValidators

    Label

    ID: labelMessage

    Text: (vuoto)

    Nota:

    Il layout esatto della pagina non è importante.

  4. Digitare il testo davanti alle caselle di testo come didascalie.

  5. Fare doppio clic sul pulsante Submit Request per creare un gestore per il relativo evento Click, quindi aggiungere il codice evidenziato riportato di seguito:

    Protected Sub buttonSubmit_Click(ByVal sender As Object, _
           ByVal e As System.EventArgs)
        If Page.IsValid Then      labelMessage.Text = "Your reservation has been processed."    End If
    End Sub
    
    protected void buttonSubmit_Click(object sender, EventArgs e)
    {
        if (Page.IsValid)    {      labelMessage.Text = "Your reservation has been processed.";    }
    }
    

    Il gestore del pulsante consente semplicemente di visualizzare un messaggio, senza eseguire alcuna elaborazione effettiva. Tuttavia, la visualizzazione del messaggio consente di eseguire il test dell'effetto della convalida più avanti nella procedura dettagliata.

  6. Passare alla visualizzazione Progettazione, fare doppio su uno spazio vuoto nella pagina per creare un gestore Page_Load, quindi aggiungere il codice evidenziato riportato di seguito:

    Protected Sub Page_Load(ByVal sender As Object, _
        ByVal e As EventArgs)
       labelMessage.Text = ""
    End Sub
    
    protected void Page_Load(object sender, EventArgs e)
    {
        labelMessage.Text = "";
    }
    

    Questo codice consente di cancellare il messaggio visualizzato dalla pagina quando tutta la convalida riesce. Il codice semplifica l'esecuzione del test più avanti nella procedura dettagliata.

Aggiunta della convalida di base

Per il sistema di prenotazione immaginario personalizzato, sarà necessario attivare i controlli di convalida riportati di seguito:

  • L'indirizzo di posta elettronica è obbligatorio e deve essere formattato in modo appropriato, ad esempio prova@esempio.com. In genere, è poco pratico verificare la reale appartenenza di un indirizzo di posta elettronica, tuttavia è possibile verificare la conformità dell'indirizzo al modello corretto per gli indirizzi di posta elettronica.

  • Viene richiesto anche il numero di persone, che deve essere un valore numerico.

  • Viene richiesta la data desiderata.

È possibile aggiungere tutti gli elementi di questa convalida utilizzando i controlli di convalida che consentono di eseguire tutte le verifiche e di visualizzare in modo automatico gli errori.

Nota:

Successivamente, nella procedura dettagliata sarà aggiunto un altro controllo per accertarsi che la data immessa sia valida.

Per aggiungere la convalida di base

  1. Passare alla visualizzazione Progettazione. Dal gruppo Convalida della Casella degli strumenti, trascinare un controllo RequiredFieldValidator e rilasciarlo accanto alla casella di testo textEmail.

  2. Impostare le proprietà del controllo RequiredFieldValidator riportate di seguito:

    Proprietà

    Impostazione

    ControlToValidate

    textEmail

    Associa il controllo di convalida alla casella di testo con il contenuto da convalidare.

    Display

    Dynamic

    Specifica che il controllo esegue il rendering (e occupa spazio nella pagina) soltanto se richiesto per visualizzare un errore.

    ErrorMessage

    E-mail address is required.

    Visualizza il testo in un riepilogo dell'errore, che sarà configurato più avanti nella procedura dettagliata.

    Text

    *

    Un asterisco rappresenta un metodo convenzionale per indicare che il campo è obbligatorio. Questo testo sarà visualizzato soltanto se esiste un errore.

    ValidationGroup

    AllValidators

    Allo stesso modo dei pulsanti di opzione, le convalide possono essere riunite in gruppi da considerare come un'unità. Ulteriori informazioni sul raggruppamento delle convalide saranno fornite più avanti nella procedura dettagliata.

    Alle operazioni svolte è aggiunto un test per accertare l'immissione di un indirizzo di posta elettronica da parte dell'utente. Il controllo di convalida consente di eseguire tutte le verifiche e di visualizzare gli errori con la richiesta di aggiunta del codice alla pagina.

  3. Dal gruppo Convalida della Casella degli strumenti, trascinare un controllo RegularExpressionValidator e rilasciarlo accanto alla casella di testo RequiredFieldValidator appena aggiunta.

  4. Impostare le proprietà del controllo RegularExpressionValidator riportate di seguito:

    1. Proprietà

    1. Impostazione

    ControlToValidate

    textEmail

    Si procede di nuovo alla convalida dei dati immessi dall'utente nella casella di posta elettronica.

    Display

    Dynamic

    ErrorMessage

    E-mail addresses must be in the format of name@domain.xyz.

    Messaggio di errore più lungo.

    Text

    Invalid format!

    Messaggio di errore breve.

    ValidationGroup

    AllValidators

    Allo stesso modo dei pulsanti di opzione, le convalide possono essere riunite in gruppi da considerare come un'unità. Ulteriori informazioni sul raggruppamento delle convalide saranno fornite più avanti nella procedura dettagliata.

  5. Con il controllo RegularExpressionValidator ancora selezionato, nella finestra Proprietà, fare clic sul pulsante con i puntini di sospensione nella casella ValidationExpression.

    Le espressioni regolari costituiscono un linguaggio che può essere utilizzato per individuare modelli definiti in modo preciso nelle stringhe. Nel controllo RegularExpressionValidator, definire un'espressione regolare valida per il modello; in questo caso il modello per un indirizzo di posta elettronica valido.

    In Editor espressioni regolari è presente un elenco di espressioni regolari utilizzate comunemente che consente di utilizzare il controllo di convalida senza conoscere la sintassi delle espressioni regolari.

  6. Nell'elenco Espressioni standard, fare clic su Indirizzo di posta elettronica.

    L'espressione regolare per un indirizzo di posta elettronica è inserita nella casella Espressione di convalida.

  7. Scegliere OK per chiudere la finestra di dialogo.

  8. Aggiungere un altro controllo RequiredFieldValidator utilizzando le indicazioni contenute nei passaggi da 1 a 3. Tuttavia, in questa fase, è necessario procedere all'associazione del controllo alla casella di testo textNumberInParty e all'impostazione della relativa proprietà ErrorMessage su Please indicate how many people are in your party.

  9. Dal gruppo Convalida della Casella degli strumenti, trascinare un controllo RangeValidator e rilasciarlo accanto alla casella di testo RequiredFieldValidator appena aggiunta.

  10. Impostare le proprietà del controllo RangeValidator riportate di seguito:

    1. Proprietà

    1. Impostazione

    ControlToValidate

    textNumberInParty

    Display

    Dynamic

    ErrorMessage

    Enter a number between 1 and 20 for the number of people in your party.

    MaximumValue

    20

    In questo caso, un valore arbitrario ma elevato.

    MinimumValue

    1

    In questa applicazione, viene richiesta almeno una persona per ogni prenotazione.

    Text

    Enter a number between 1 and 20.

    Type

    Integer

    ValidationGroup

    AllValidators

    Mediante il controllo RangeValidator è possibile svolgere due funzioni: accertarsi che i dati immessi siano numerici e verificare che il numero sia compreso tra i valori minimo e massimo specificati.

Test della pagina

È ora possibile eseguire il test dei controlli di convalida di cui si dispone fino a questo momento.

Per eseguire il test della convalida di base

  1. Premere CTRL+F5 per eseguire la pagina.

  2. Quando viene visualizzata la pagina nel browser, fare clic sul pulsante Submit Request.

    Vengono visualizzati diversi errori di convalida, dal momento che non sono stati compilati alcuni campi richiesti. Notare che gli errori di convalida vengono visualizzati subito, la pagina viene inviata. Per impostazione predefinita, i controlli di convalida consentono di inserire ECMAScript (JavaScript) lato client nella pagina per eseguire il controllo della convalida nel browser. In tal modo gli utenti possono ottenere un feedback istantaneo sugli errori di convalida; senza lo script client, il controllo degli errori di convalida richiederebbe un percorso di andata e ritorno al server, che in alcuni casi potrebbe essere lento. Infatti, per inviare la pagina è necessario che tutti i controlli della convalida lato client riescano. Lo stesso controllo di convalida viene eseguito nuovamente come misura di sicurezza quando la pagina viene inviata.

  3. Verificare la convalida nella casella di testo textEmail digitando un indirizzo di posta elettronica non valido e, successivamente, digitando un indirizzo di posta elettronica valido, ad esempio il proprio indirizzo.

  4. Verificare che sia possibile immettere soltanto valori numerici compresi tra 1 e 20 nella casella di testo Number of people in party.

  5. Dopo avere immesso i valori validi, fare clic sul pulsante Submit Request. Se la convalida supera tutti i controlli, verrà visualizzato il messaggio Your reservation has been processed.

  6. Dopo avere confermato il corretto funzionamento della convalida, chiudere il browser.

Se la convalida non funziona come previsto, eseguire un'ulteriore verifica su tutte le impostazione delle proprietà sopra elencate ed eseguire di nuovo la pagina.

Metodi alternativi per visualizzare informazioni di errore

Per impostazione predefinita, i controlli di convalida consentono di visualizzare il testo in una determinata posizione vale a dire che consentono di visualizzare il valore della proprietà Text del controllo nella posizione del controllo all'interno della pagina. In alcuni casi può essere necessario visualizzare le informazioni di errore in modi diversi. I controlli di convalida ASP.NET forniscono le seguenti opzioni aggiuntive:

  • Riepilogare tutti gli errori di convalida in un'unica posizione. Tale operazione può essere eseguita in aggiunta oppure in sostituzione della visualizzazione degli errori sul posto. Inoltre la visualizzazione di riepiloghi di errori consente di visualizzare messaggi di errore più lunghi.

  • Visualizzare un messaggio popup nel browser con informazioni sull'errore. Questa opzione funziona soltanto su browser attivati da script.

È possibile aggiungere entrambe queste opzioni di visualizzazione utilizzando il controllo ValidationSummary. In questa parte della procedura dettagliata, saranno aggiunte entrambe le funzionalità di visualizzazione alla pagina.

Per visualizzare le informazioni sulla convalida con metodi alternativi

  1. Dal gruppo Convalida della Casella degli strumenti, trascinare un controllo ValidationSummary nella pagina.

  2. Impostare la proprietà ValidationGroup del controllo ValidationSummary su AllValidators.

  3. Eseguire la pagina.

  4. Eseguire la stessa verifica effettuata in precedenza nella procedura dettagliata.

    Per ciascun errore, le informazioni sono visualizzate in due posizioni. Un messaggio di errore breve (il valore della proprietà Text della convalida) viene visualizzato nel punto in cui si trova il controllo di convalida. Il messaggio di errore più lungo (il valore della proprietà ErrorMessage del controllo) viene visualizzato nel controllo ValidationSummary.

  5. Chiudere il browser.

  6. Impostare la proprietà ShowMessageBox del controllo ValidationSummary su true.

  7. Eseguire la pagina.

  8. Eseguire gli stessi test.

    In questo caso, ciascun errore genera un messaggio popup nel browser.

  9. Chiudere il browser.

Aggiunta della convalida personalizzata per verificare l'immissione della data

Nei controlli di convalida ASP.NET non è incluso un controllo che verifichi in modo automatico la validità di una data. Tuttavia, è possibile utilizzare il controllo CustomValidator a questo scopo. La convalida personalizzata consente di scrivere il codice di convalida personalizzato per verificare le condizioni richieste per l'applicazione. In questa procedura dettagliata, verrà utilizzato il valore CustomValidator per verificare che il valore immesso nella casella di testo textPreferredDate possa essere convertito in un valore di data.

Saranno inclusi due blocchi di codice di convalida personalizzato. Il primo blocco è il codice di convalida personalizzato eseguito quando la pagina viene inviata. È necessario disporre sempre della logica di convalida lato server per un controllo CustomValidator. Inoltre, saranno scritti alcuni script client (ECMAScript oppure JavaScript) che consentono di eseguire una verifica simile nel browser, in modo che l'utente possa disporre di un feedback immediato.

Per utilizzare un controllo CustomValidator per verificare la validità di una data

  1. Dal gruppo Convalida della Casella degli strumenti, trascinare un controllo CustomValidator nella pagina e posizionarlo accanto alla casella di testo textPreferredDate.

  2. Impostare le proprietà del controllo CustomValidator riportate di seguito:

    Proprietà

    Impostazione

    ControlToValidate

    textPreferredDate

    Display

    Dynamic

    ErrorMessage

    Enter a date in the format m/d/yyyy.

    Text

    Invalid date format (requires m/d/yyyy).

    ValidationGroup

    AllValidators

  3. Fare doppio clic sul controllo CustomValidator per creare un gestore per il relativo evento ServerValidate, quindi aggiungere il codice evidenziato riportato di seguito.

    Protected Sub CustomValidator1_ServerValidate( _
       ByVal source As Object, _
       ByVal args As System.Web.UI.WebControls.ServerValidateEventArgs)
       Try      DateTime.ParseExact(args.Value, "d", _         System.Globalization.DateTimeFormatInfo.InvariantInfo)      args.IsValid = True   Catch      args.IsValid = False   End Try
    End Sub
    
    protected void CustomValidator1_ServerValidate(object source, 
        ServerValidateEventArgs args)
    {
        try    {        DateTime.ParseExact(args.Value, "d",            System.Globalization.DateTimeFormatInfo.InvariantInfo);        args.IsValid = true;    }    catch    {       args.IsValid = false;    }
    }
    

    Questo codice viene eseguito quando l'utente invia la pagina. Il codice interagisce con il controllo di convalida mediante l'oggetto ServerValidateEventArgs (args) passato nel gestore. Il valore immesso nella casella di testo textPreferredDate viene passato come proprietà Value dell'oggetto args. Dopo avere verificato la validità dei dati immessi dall'utente, la proprietà IsValid dell'oggetto args viene impostata su true oppure su false. Se impostata su false, nella convalida sarà visualizzato il relativo messaggio di errore.

    In questo esempio, il codice consente di utilizzare un blocco try-catch per determinare se i dati immessi dall'utente possono essere convertiti in un oggetto DateTime. Se l'utente immette un valore non valido (non conforme alla data nel formato g/m/aaaa), nel metodo ParseExact dell'oggetto DateTime viene generata un'eccezione e viene eseguito il blocco Catch.

    Nota:

    Il valore del parametro provider del metodo DateTime.ParseExact è indipendente dalle impostazioni cultura. Se occorre utilizzare le impostazioni cultura correnti, impostare provider su null.

  4. Nel gestore Button_Click aggiungere il codice evidenziato riportato di seguito:

    Protected Sub buttonSubmit_Click(ByVal sender As Object, _
           ByVal e As System.EventArgs)
       If Page.IsValid Then
          labelMessage.Text = "Your reservation has been processed."
       Else     labelMessage.Text = "Page is not valid."End If
    End Sub
    
    protected void buttonSubmit_Click(object sender, EventArgs e)
    {
        if(Page.IsValid)    {
            labelMessage.Text = "Your reservation has been processed.";
        }    else    {        labelMessage.Text = "Page is not valid.";    }
    }
    

    Quando si utilizza un controllo CustomValidator, è necessario verificare la proprietà Page.IsValid in tutte le elaborazioni lato server per accertarsi che tutti i controlli di convalida siano stati superati. Mediante la proprietà IsValid viene restituito lo stato di tutti i controlli di convalida nella pagina. Questa proprietà è utilizzata per accertarsi che tutti i controlli di convalida abbiano superato le elaborazioni lato server.

È stato aggiunto il codice lato server per il controllo CustomValidator per verificare la validità di una data. Come descritto in precedenza nella procedura dettagliata, i controlli di convalida consentono anche di verificare anche i dati immessi da un utente utilizzando lo script client. È possibile aggiungere lo script client anche al controllo CustomValidator. In effetti, viene scritto lo script client che consente di duplicare la logica eseguita dalla convalida lato server. La scrittura del codice di convalida personalizzato lato client non è sempre pratica; ad esempio, nel caso in cui il codice personalizzato consenta la convalida dei dati immessi da un utente eseguendo la ricerca in un database lato server. Tuttavia, in questo caso è possibile creare il codice lato client che consente di eseguire essenzialmente la stessa verifica che viene eseguita dal codice lato server.

Per aggiungere lo script client al controllo CustomValidator

  1. Aprire la pagina Default.aspx. o passare a questa pagina.

  2. Nell'elemento <head> della pagina aggiungere il blocco di script client riportato di seguito:

    <script language="javascript">
    function validateDate(oSrc, args)
    {
      var iDay, iMonth, iYear;
      var arrValues;
      arrValues = args.Value.split("/");
      iMonth = arrValues[0];
      iDay = arrValues[1];
      iYear = arrValues[2];
    
      var testDate = new Date(iYear, iMonth - 1, iDay);
      if ((testDate.getDate() != iDay) ||
          (testDate.getMonth() != iMonth - 1) ||
          (testDate.getFullYear() != iYear))
      {
         args.IsValid = false;
         return;
      }
    
      return true;
    }</script>
    
    Nota:

    Per ECMAScript (JavaScript) viene applicata la distinzione tra maiuscole e minuscole; immettere il codice esattamente come illustrato di seguito.

    Questo codice è simile al controllo di convalida lato server, ma non è rigoroso allo stesso modo. I dati immessi dall'utente vengono passati alla funzione come proprietà Value dell'oggetto args ed è possibile impostare la proprietà IsValid dell'oggetto per indicare se il valore supera la convalida. In questo esempio, il codice consente di eseguire una verifica per accertare che siano state immesse date numeriche valide.

    Notare che il codice per la convalida personalizzata è leggermente differente nello script client rispetto al codice server. In ECMAScript non è fornita la stessa funzionalità presente in .NET Framework. Di conseguenza, in ECMAScript viene analizzato il testo immesso invece del codice ParseExact utilizzato nel server per verificare la data. Tuttavia, i due controlli di convalida (client e server) sono simili abbastanza per fornire le funzionalità necessarie.

  3. Immettere il punto di inserimento nell'elemento <asp:customvalidator> per selezionarlo.

  4. Nella finestra Proprietà, impostare la proprietà ClientValidationFunction del controllo su validateDate, che è il nome della funzione di ECMAScript appena creata.

    È stato appena aggiunto un controllo di convalida personalizzato che funziona sia nello script client per verificare immediatamente i dati immessi dall'utente, sia nuovamente, quando la pagina viene inviata al server.

Test della convalida personalizzata

È ora possibile eseguire il test per verificare il corretto funzionamento della convalida personalizzata.

Per eseguire il test della convalida personalizzata

  1. Disattivare temporaneamente la convalida lato client impostando la proprietà EnableClientScript del controllo CustomValidator su false.

  2. Premere CTRL+F5 per eseguire la pagina.

  3. Inserire un indirizzo di posta elettronica e il numero di persone che partecipano alla festa in modo che sia effettuata la convalida per questi campi.

  4. Nella casella di testo della data, immettere una stringa che non sia, ovviamente, una data e fare clic sul pulsante Submit Request.

    Nella pagina viene eseguito un percorso di andata e ritorno al server Web, in cui la convalida lato server non ha esito positivo. Il test della proprietà IsValid ha esito negativo e in labelMessage viene visualizzato il messaggio "Page is not valid".

  5. Inserire un valore di data valido (ad esempio, 17/11/2005) e fare clic sul pulsante.

    In questo caso, la convalida del valore della data ha esito positivo e viene visualizzato un messaggio creato nel gestore Click del pulsante.

  6. Chiudere il browser.

  7. Riattivare la convalida lato client impostando la proprietà EnableClientScript del controllo CustomValidator nuovamente su true.

  8. Eseguire di nuovo la pagina e immettere valori validi per l'indirizzo di posta elettronica e il numero di persone partecipanti alla festa.

    Immettere un valore di data non valido nella casella di testo della data e premere il tasto TAB. Non fare clic sul pulsante.

    Non appena la casella di testo perde lo stato attivo, lo script di convalida lato client viene eseguito e viene visualizzato un messaggio di errore.

    Nota:

    In caso di utilizzo di un'opzione di completamento automatico in Internet Explorer, la selezione di un valore dell'elenco di completamento automatico consentirà di inserire un valore nella casella di testo, ma la convalida lato client non sarà eseguita.

  9. Fare clic sul pulsante Submit Request.

    Dal momento che la convalida lato client per la casella di testo della data ha avuto esito negativo, la pagina non viene inviata.

  10. Correggere il valore della data e premere nuovamente il tasto TAB.

    Il messaggio di errore scompare. È ora possibile inviare il form.

Aggiunta di controlli opzionali con convalida condizionale

Nella parte finale della procedura dettagliata, saranno aggiunte alcune informazioni opzionali per il form di prenotazione. Gli utenti potranno selezionare una casella per indicare la richiesta di conferma telefonica della prenotazione. In tal caso, è necessario immettere il numero di telefono. Nella pagina saranno quindi contenuti due controlli aggiuntivi: una casella di controllo e una casella di testo.

Come in precedenza, sarà utilizzata la convalida per verificare i dati immessi dall'utente. Verrà utilizzato un controllo RequiredFieldValidator per accertarsi che l'utente immetta un numero di telefono e un controllo RegularExpressionValidator per verificarne il formato. Il numero di telefono è opzionale; è necessario verificare il numero di telefono soltanto se è stata selezionata la casella di controllo Confirm reservation by phone. Di conseguenza, sarà scritto un codice semplice che consente di attivare o disattivare la convalida del numero di telefono in base allo stato della casella di controllo.

Per aggiungere la convalida condizionale

  1. Dal gruppo Standard della Casella degli strumenti, trascinare un controllo CheckBox nella pagina e impostarne le proprietà riportate di seguito.

    Proprietà

    Impostazione

    ID

    checkPhoneConfirmation

    AutoPostBack

    True

    Quando l'utente fa clic sulla casella di controllo, nella pagina sarà eseguito un percorso di andata e ritorno e verranno attivate, in modo condizionale, la casella di testo e la relativa convalida.

    CausesValidation

    False

    La convalida non sarà eseguita automaticamente facendo clic sull'oggetto CheckBox.

    Text

    Confirm reservation by telephone.

  2. Trascinare un controllo TextBox nella pagina al di sotto del controllo CheckBox e impostare le proprietà riportate di seguito.

    1. Proprietà

    1. Impostazioni

    ID

    textPhoneNumber

    Enabled

    False

    La casella di testo sarà attivata soltanto dopo che l'utente ha fatto clic sulla casella di controllo.

  3. Digitare un testo, ad esempio Numero di telefono:, accanto alla casella di testo del numero di telefono come didascalia.

  4. Dal gruppo Convalida della Casella degli strumenti, trascinare un controllo RequiredFieldValidator nella pagina e impostare le proprietà riportate di seguito.

    Proprietà

    Impostazione

    ID

    validatorRequiredPhoneNumber

    In precedenza, nella procedura dettagliata, non è stato impostato l'ID dei controlli di convalida; tuttavia, in questo caso sarà fatto riferimento al controllo di convalida nel codice, per cui è utile fornire un ID facile da ricordare.

    ControlToValidate

    textPhoneNumber

    Display

    Dynamic

    ErrorMessage

    You must provide a phone number.

    Text

    *

    ValidationGroup

    (lasciare vuoto)

    Se questa proprietà è vuota, la convalida non appartiene al gruppo AllValidators stabilito per gli altri controlli di convalida nella pagina. Di conseguenza, per impostazione predefinita questa convalida non viene verificata quando si fa clic sul controllo buttonSubmit.

  5. Trascinare un controllo RegularExpressionValidator nella pagina e impostare le proprietà riportate di seguito.

    Proprietà

    Impostazione

    ID

    validatorRegExPhoneNumber

    ControlToValidate

    textPhoneNumber

    Display

    Dynamic

    ErrorMessage

    Il formato del numero di telefono non è valido.

    Text

    Formato non valido.

    ValidationExpression

    Utilizzare la finestra di dialogo Editor espressioni regolari per selezionare un Numero di telefono statunitense oppure un'altra espressione di numero di telefono.

    ValidationGroup

    (lasciare vuoto)

  6. Fare doppio clic sul controllo checkPhoneConfirmation per creare un gestore per il relativo evento CheckedChanged, quindi aggiungere il codice evidenziato riportato di seguito.

    Protected Sub checkPhoneConfirmation_CheckedChanged( _
       ByVal sender As Object, _
       ByVal e As System.EventArgs)
       If checkPhoneConfirmation.Checked = True Then      textPhoneNumber.Enabled = True      validatorRequiredPhoneNumber.ValidationGroup = "AllValidators"      validatorRegExPhoneNumber.ValidationGroup = "AllValidators"   Else      textPhoneNumber.Enabled = False      validatorRequiredPhoneNumber.ValidationGroup = ""      validatorRegExPhoneNumber.ValidationGroup = ""   End If
    End Sub
    
    protected void checkPhoneConfirmation_CheckedChanged(
        object sender, EventArgs e)
    {
        if(checkPhoneConfirmation.Checked)    {        textPhoneNumber.Enabled = true;        validatorRequiredPhoneNumber.ValidationGroup =             "AllValidators";        validatorRegExPhoneNumber.ValidationGroup = "AllValidators";    }    else    {        textPhoneNumber.Enabled = false;        validatorRequiredPhoneNumber.ValidationGroup = "";        validatorRegExPhoneNumber.ValidationGroup = "";    }
    }
    

    Quando l'utente fa clic sulla casella di controllo, le due convalide associate alla casella di testo vengono aggiunte al gruppo di convalida a cui appartengono gli altri controlli di convalida. Di conseguenza, tutte le convalide presenti nella pagina, incluse quelle per il numero di telefono, saranno verificate quando l'utente invia la pagina. Se l'utente deseleziona la casella di controllo, le convalide vengono rimosse dal gruppo e pertanto non vengono elaborate quando si fa clic sul pulsante Submit Request.

Test della convalida condizionale

È ora possibile eseguire il test per verificare il corretto funzionamento della convalida condizionale.

Per eseguire il test della convalida condizionale

  1. Premere CTRL+F5 per eseguire la pagina.

  2. Immettere informazioni valide per l'indirizzo di posta elettronica, il numero di persone partecipanti alla festa e la data.

  3. Fare clic su Submit Request.

    La pagina viene inviata e viene visualizzato il messaggio di conferma.

  4. Selezionare la casella di controllo Confirm reservation by phone.

  5. Fare di nuovo clic su Submit Request.

    In questo caso viene visualizzato un messaggio di errore (un asterisco accanto alla casella di testo del telefono). Dopo avere fatto clic sulla casella di controllo, viene attivata la convalida per la casella di testo.

  6. Immettere un numero di telefono non valido e fare di nuovo clic su Submit Request per confermare che nella casella di testo non sarà accettato un numero di telefono non valido.

  7. Immettere un numero di telefono formattato in modo corretto e fare clic sul pulsante di invio per confermare che il controllo di convalida accetta dati in formato corretto.

    Nota:

    Se nella finestra di dialogo Editor espressioni regolari si è selezionato un Numero di telefono statunitense per la proprietà ValidationExpression del controllo RegularExpressionValidator, un numero di telefono formattato correttamente è costituito dal prefisso (campo facoltativo contenente 3 caratteri numerici racchiusi fra parentesi o seguiti da un trattino) seguito da un insieme di 3 caratteri numerici, un trattino e infine un insieme di 4 caratteri numerici. Esempi validi sono i numeri (425) 555-0123, 425-555-0123 o 555-0123.

Passaggi successivi

Mediante la convalida aggiunta alla pagina Web Form vengono illustrati i concetti di base dei controlli di convalida Web.

Un aspetto importante della convalida riguarda le informazioni sulla possibilità di utilizzare la convalida per aumentare la sicurezza per il sito Web. Per informazioni dettagliate, vedere Cenni preliminari sui pericoli di protezione a cui sono esposte le applicazioni Web

Vedere anche

Concetti

Cenni preliminari sugli attacchi tramite script

Riferimenti

Convalida dell'input utente nelle pagine Web ASP.NET