Inviare un form in più step
Spesso, in fase di invio dei dati attraverso un form, è preferibile non presentare all'utente un modulo molto lungo al fine di non scoraggiarlo da una compilazione apparentemente lunga e complessa: a tal fine, quindi, è consigliabile dividere il modulo in più step da presentare in sequenza.
Generalmente, si usa associare - all'interno di ciascun blocco - i dati omogenei; ad esempio un modulo di registrazione pottrebbe essere così suddiviso: username, password ed email in un primo blocco blocco, i dati anagrafici in un altro blocco e cosi via.
Grazie alle funzioni predefinite del .NET Framework, è molto semplice in ASP.NET realizzare un simile sistema in cui, all'interno della stessa pagina, avverrà quanto segue:
- mostriamo un blocco di dati;
- verifichiamo la compilazione;
- se corretto, nascondiamo il blocco per passare al successivo.
Veniamo dunque ad un esempio pratico, iniziando dal codice HTML, opportunamente costruito attraverso il controlli server del .NET:
<form runat="server"> <p><asp:literal id="numero" runat="server"/></p> <p><asp:textbox id="uno" runat="server"/></p> <p><asp:button id="c1" runat="server" text="Continua" onclick="Step1"/></p> <p><asp:textbox id="due" runat="server"/></p> <p><asp:button id="c2" runat="server" text="Continua" onclick="Step2"/></p> <p><asp:textbox id="tre" runat="server"/></p> <p><asp:button id="c3" runat="server" text="Conferma" onclick="Step3"/></p> <p><asp:literal id="messaggio" runat="server"/></p> </form>
Nel nostro esempio, ogni step è costituito da un unico campo e da un unico bottone di invio: tutti i bottoni porteranno allo step successivo, tranne l'ultimo che porterà alla materiale gestione dei dati.
Notiamo che all'inizio ed alla fine usiamo due elementi testuali: il primo serve ad indicare il numero dello step corrente, mentre in quello in fondo mostreremo i messaggi di errore e di conferma ad operazioni concluse.Analizziamo il codice VB.NET:
<script runat="server" Language="VB">
Private Sub Page_Load(sender As Object, e As System.EventArgs)
If Page.IsPostBack = False Then
numero.Text = "Step 1"
due.Visible = False
tre.Visible = False
c2.Visible = False
c3.Visible = False
End If
End Sub
Private Sub Step1(sender As Object, e As System.EventArgs)
If uno.Text = "" Then
messaggio.Text = "Campo obbligatorio!"
Exit Sub
End If
numero.Text = "Step 2"
uno.Visible = False
due.Visible = True
c1.Visible = False
c2.Visible = True
messaggio.Text = ""
End Sub
Private Sub Step2(sender As Object, e As System.EventArgs)
If due.Text = "" Then
messaggio.Text = "Campo obbligatorio!"
Exit Sub
End If
numero.Text = "Step 3"
due.Visible = False
tre.Visible = True
c2.Visible = False
c3.Visible = True
messaggio.Text = ""
End Sub
Private Sub Step3(sender As Object, e As System.EventArgs)
If tre.Text = "" Then
messaggio.Text = "Campo obbligatorio!"
Exit Sub
End If
numero.Text = "Risultato"
tre.Visible = False
c3.Visible = False
messaggio.Text = "Uno: " & uno.Text & "<br>Due: " & due.Text & "<br>Tre: " & tre.Text
End Sub
</script>
Innanzitutto, al caricamento della pagina verifichiamo l'evento PostBack per verificare che il contenuto della pagina non sia "falsato". Al suo interno mostriamo il messaggio da far comparire come titolo del primo step e nascondiamo tutti gli elementi degli step successivi.
Abbiamo poi delle routine che verificano la compilazione del campo corrente, nascondono lo step precedente e mostrano quello successivo.
Solo l'ultimo step non mostrerà, ovviamente, uno step successivo, bensì eseguirà la gestione dei dati: nel nostro esempio, limitandosi a mostrare a video i dati stessi.
Lascio al lettore il compito di eseguire quanto segue: creare per ogni step delle Label lato server ed utilizzarle per nascondere tutti i campi di un unico step (es. nome, cognome; username, password; email, sito Web).
