VB.NET e le WebForm - medinfo

Visual Basic .NET: le componenti Web Form
e la realizzazione di un’applicazione Web
Prof. Mauro Giacomini
A.A. 2008-2009
Le WebForm
 Consentono la realizzazione di interi progetti web-oriented





in puro HTML che sono eseguibili su tutti i browser
La programmazione delle WebForm avviene con un qualsiasi
linguaggio supportato dal CLR
Progettazione dell’interfaccia visuale a oggetti
Separazione del codice (gestione eventi) dalla presentazione
(invece in nelle versioni precedenti convivevano nello stesso
documento)
Gestione dello stato della pagina (ovvero registrazione delle
scelte svolte da ogni utente che accede alla pagina Web)
Integrate con il modello ad eventi di Windows sia per il lato
server sia per il lato client
Creazione di una WebForm
 Sulla WebForm si lavora con una solita form popolata dagli
oggetti tipici delle interfacce VB con il solito drag and drop (o
meglio con una pianificazione a tabella della pagina)
 Estensione .aspx propria della tecnologia ASP.NET
 Distinzione dei componenti
 Lato server
 Lato client
 Separazione della parte in HTML (interfaccia utente –
estensione .aspx) dalla logica applicativa (scritta in VB.NET –
estensione .vb o in C#, estensione .cs …)
WebForm Designer
 Foglio bianco che raccoglie le compnenti dal toolbox di
tipo:
 Tipo WebForm
 Tipo Data
 Tipo Components
 HTML
 Altre possibili componenti se installate ad hoc
 Usuale impostazione delle proprietà degli oggetti
Componenti lato server
 Producono i diversi tipi di output visualizzabile sia
sui diversi dispositivi sia sui browser
 Due insiemi di componenti lato server
 Controlli HTML
 Controlli Web
 Generano le pagine HTML dell’applicazione
 Preservano lo stato della sessione
 Espongono gli eventi necessari alla gestione lato
client
Componenti HTML
 Namespace: System.Web.UI.HtmlControls
 Attivati dalla direttiva runat=“server”
 Es. istanza di HtmlInputText chiamata text1
<input type = “text”
runat = “server”
value = “ciao” >
id = “text1”
Gerar
chia
della
classe
HtmlC
ontrol
s
Tag
vs
component
i
Componenti Web
 Namespace: System.Web.UI.WebControls
 Sostanzialmente identici ai controlli della form di VB delle
precedenti versioni
 Sfruttano la tecnologia della piattaforma di ASP.NET
 Componenti complessi es:
 Calendario
 Crystal Report Viewer
 Autoadattamento allo schermo con il browser
 Data-bound capability, sono tutti associabili a una sorgente
di dati (inizializzata e connessa)
 Direttiva runat = “server”
Gerarchia
componenti
Web
Elenco componenti (1)
 Label (testo non modificabile dal client che legge la pagina)
 TextBox
 Testo modificabile (direttamente dal client) e data-bound
 Modalità single-line, multi-line, password






CheckBox (gestione sì/no)
RadioButton (gestione sì/no) mutuamente esclusiva
DropDownList (lista di scelta apribile per selezione singola)
ListBox (elenco di voci selezionabili anche a gruppi)
CheckBoxList
RadioButtonList
Elenco controlli (2)
 Button
 Invia al server dati immessi dal client
 Definizione di eventi
 Link buttom (simile al button, ma con hyperlink)
 Image button
 HyperLink
 Imagedisplay
 Panel (raggruppa componenti)
Elenco controlli (3)
 Table (contiene strutture tabellari in associazione con





TableRow e TableCell)
Calendar (visualizzazione di calendario perpetuo)
Repeater (controllo list-bound connesso a una
sorgente di dati che è visualizzata con controlli
personalizzati con un template HTML)
DataList (simile al precedente con diverso metodo di
personalizzare il layout)
DataGrid (connessione ai dati e presentazione in
tabella con possibilità di modifiche direttamente sul
DB)
AdRotator (visualizza a banner informazioni in XML)
Varie
 Commenti - sintassi
 <%-- codice da commentare --%>
 Generazione applicazione Web
 scegliere progetto ASP .NET Web Application
 due facce: design e HTML
Proprietà del progetto (1)
 Raccolte in una vista ad albero
 Due macrocategorie: Common e Configuration
 Common properties





General (nome, modulo di start, root namespace)
Build (proprietà di compilazione)
Imports (classi utilizzate già presenti quelle indispensabili)
Strong name (meccanismi di protezione del codice per
aggiornamenti successivi)
Designer default (caratteristiche dell’ambiente di sviluppo tra
cui il linguaggio di scripting nel nostro caso VB)
Proprietà del progetto (2)
 Configuration properties: dedicate alla ottimizzazione
del debug, compilazione e rilascio del progetto


Optimization: uguale a quella delle versioni precedenti
Build e Deployment: indicano la directory dove rilascare
l’eseguibile finale, inserimento di warning all’interno del
codice, mantenimento delle informazioni di debug
Proprietà del documento HTML
 General
 browser di default, linguaggi lato server e lato client
 Colors
 colori di: sfondo, link, link visitati, …
 Margin and Keywords
 parole chiavi per i motori di ricerca
Global.asax
 Naturale estensione del Global.asa delle applicazioni ASP
 Definire alcuni parametri globali e attivare alcuni eventi
come la creazione di una nuova sessione o chiusura
dell’intera applicazione
 Struttura tipo:
Public Class Global
Inherits System.Web.HTTPApplication
Sub Application_BeginRequest (ByVal sender as object, Byval
e as EventArgs)
…
End Sub
…
End Class
Possibili
contenuti di
Global.asax
Web.config
 In formato XML
 elemento principale con tag <configuration>
 due sottogruppi: dichiarazioni ed impostazioni
 nelle dichiarazioni è possibile ad esempio inserire le
impostazioni per le stringhe di connessione ai DB
 indicazione dei compliatori e degli assemblatori
 indicazione dei namespace
Web.config: Esempio
<configuration>
<system.web>
<compilation defaultLanguage=“VB” debug=“true”>
<compilers>
<compiler language=“VB;VBScript” extension= “.cls” type =
“Microsoft.VB.VBCodeProvider,System” />
</compliers>
<assembiles>
<add assembly = “ADODB” />
</assemblies>
<namespaces>
<add namespeces = “System.Web” />
<add namespeces = “System.Web.UI” />
</namespaces>
</compilation>
</system.web>
</configuration>
Modello degli eventi
 Separazione fra dove si verifica l’evento (client) e dove viene
gestito (server)
 Le informazioni relative all’evento sono catturate sul client
e inviate al server con il protocollo HTTP
 La gestione delle Web form interpreta il messaggio e invoca
la procedura connessa
 Questi meccanismi sono trasparenti nella programmazione
della programmazione ma con l’accorgimento di rispettare
alcuni vincoli per evitare la perdita di efficienza del
programma
Vincoli sugli eventi
 Numero di controlli limitati
 non supportati eventi frequenti es onMouseOver
 versioni speciali di eventi quali onChange
 Gestione differita degli eventi
 controlli server attivati solo da un clic su un pulsante catturati
dal controllo sul client e inviati tutti assieme
 gestione di tutti gli eventi di modifica senza ordine prima e
dopo la procedure di gestione del tasto premuto
 per obbligare l’invio di un evento di modifica prima degli altri
porre AutoPostBack a True
 Distribuzione degli eventi
 controlli complessi (DataList e DataGrid) intercettano gli
eventi dei controlli contenuti e generano un evento generico
ItemCommand con parametri
Procedure d’evento
<asp:Button id=“btn” onClick=“Convalida”
runat=“server” />
Associa all’evento Click la procedura Convalida
Due parametri associati all’evento
 Oggetto che ha generato l’evento
 Oggetto con informazioni specifiche sull’evento (EventArgs) ad
esempio ImageButton genera ImageClickEventArgs con
coordinate
Sub Convalida (src As Object, e As EventArgs)
Eventi delle Web Form
 Page_Init (inizializzazione delle variabili, si crea un’istanza
lato server dell’oggetto Page)
 Page_Load (ogni volta che viene caricata dal runtime di
ASP.NET a causa di una richiesta del browser, si può
cambiare il contenuto dei controlli)
 Page_Unload (ultimo evento di una pagina caricamento di
altra pagina, attività di registrazione in un file di log,
chiusura di file e database, distruzione dell’oggetto Page)
Esempi
Sub Page_Load (src as Object, e as EventArgs)
txtName.Text = “Pippo”
End Sub
Sempre Pippo nella Text ad ogni refresh
Sub Page_Load (src as Object, e as EventArgs)
if not Page.IsPostBack Then
txtName.Text = “Pippo”
end if
End Sub
Solo la prima volta Pippo nella Text
Validazione dell’input
 Lato server
 Più sicura (si può fare sempre)
 Più lenta (necessita di mandare tutti i dati al server)
 Lato client
 Più veloce
 Incerta (l’utente può aver disabilitato gli script)
 Controlli di ASP.NET automaticamente scelgono, se
possibile lato client altrimenti lato server
Sintassi
<asp:controllo_validazione
id=“controllo_validazione”
runat=“server”
ControlToValidate = “id_controllo”
ErrorMessage = “messaggio d’errore”
Display = “modalità di visualizzazione”>
</asp:controllo_validazione>
Modalità di Visualizzazione
 Static: compare quando si verifica l’errore, ma permane
anche se l’errore è corretto fino al successivo submit
 Dynamic: compare in presenza di errori e scompare se si
risolve il problema anche senza un submit
 None: non visualizza il messaggio, solo lo registra nel
ValidationSummary
 Si possono applicare più controlli di validazione a uno
stesso oggetto, basta indicare tutte le volte che
necessario il nome dell’oggetto da controllare nella
proprietà ControlToValidate.
RequiredFieldValidator
 Controllo di immissione obbligatoria
 Esempio
<asp:TextBox id=“txtNome” runat=“server” />
<asp:RequiredFieldValidator id=“ConvalidatxtNome” runat=“server”
ControlToValidate=“txtNome”
ErrorMessage=“Inserisci il tuo nome”
Display=“dynamic”>
</asp:RequiredFieldValidator>
RangeValidator
 Controllo del range del valore inserito (se vuoto, valido)
 Da esplicitare il tipo di variabile
 Tipi possibili: Integer, Double, Currency, Date, String
 Esempio
<asp:TextBox id=“txtEta” runat=“server” />
<asp:RangeValidator id=“ConvalidatxtEta” runat=“server”
ControlToValidate=“txtEta”
Type=“Integer”
MinimumValue = “18”
MaximumValue = “50”
ErrorMessage=“E’ richiesta un’età fra i 18 e i 50 anni”
Display=“dynamic”>
</asp:RangeValidator>
CompareValidator
 Confronto con valore predefinito (ValueToCompare) o valore di un altro controllo (ControlToCompare),
con tipo
 Da indicare l’operatore (Operator), possibili operatori:

Equal, NotEqual, GreaterThan, GreaterThanEqual, LessThan, LessThanEqual, DataTypeCheck
 Esempio
<asp:TextBox id=“txtEta” runat=“server” />
<asp:CompareValidator id=“ConvalidatxtEta” runat=“server”
ControlToValidate=“txtEta”
Type=“Integer”
ValueToCompare = “0”
Operator = “GreaterThanEqual”
ErrorMessage=“Inserire un valore positivo”
Display=“dynamic”>
</asp:CompareValidator>
RegularExpressionValidator
 Controllo su uno schema predefinito del dato di ingresso (carta di credito, email, codicefiscale, ecc…)
 Proprietà specifica: ValidationExpression
 Caratteri da utilizzare (vedi pagina successiva)
 Esempio
<asp:TextBox id=“txtEmail” runat=“server” />
<asp:RegularExpressionValidator id=“ConvalidatxtEmail”
runat=“server”
ControlToValidate=“txtEmail”
ValidationExpression=“[\w.]+@[\w]+.(it|com|org|net)”
ErrorMessage=“Inserire un indirizzo di email corretto”
Display=“dynamic”>
</asp:CompareValidator>
Caratteri per espressioni regolari
(1)
| Consente di specificare valori alternativi
* Specifica 0 o più occorrenze dell’elemento che lo
precede es ba* significa b, ba, baa, baaa, baaaa, …
+ Specifica 1 o più occorrenze dell’elemento che lo
precede es ba+ significa ba, baa, baaa, baaaa, …
? Specifica 0 o 1 occorrenze dell’elemento che lo
precede es ba? significa b o ba
[ ] Consentono di specificare valori alternativi
[aeiou] indica una qualsiasi vocale
Caratteri per espressioni regolari
(2)
\w Indica un qualsiasi carattere alfanumerico compreso
_
\s Indica un qualsiasi carattere di spaziatura
\d Indica un qualsiasi carattere numerico
{} Consente di indicare un numero preciso di occorrenze
o di delimitarne il numero massimo o minimo. Es. a{3}
indica aaa; a{3,} indica le stringhe di almeno tre a; a{,3}
indica da 0 a tre caratteri a; a{3,5} indica aaa, aaaa,
aaaaa.
() Consente di individuare sottostringhe Es:
\w.+(exe|com|bat) indica tutti i possibili eseguibili
DOS
CustomValidator
Consente di definire i vincoli da verificare perché un input
utente sia valido specificando se la convalida vada fatta sul
client (ClientValidationFunction) o sul server
(OnServerValidate). Sul server la validazione inizia con
l’evento ServerValidate a cui è passato il parametro
ServerValidateEventArgs la cui proprietà Value contiene
il valore inserito nel controllo indicato. Il risultato del processo
di validazione viene restituito nella proprietà IsValid dello
stesso parametro.
CustomValidatorEsempio
<html>
<head>
<script language=“VB” runat=“server”>
Sub Convalida (src As Object, e As ServerValidateEventArgs)
If Page.IsValid Then
Msg.Text = “Ok!”
End If
End Sub
Sub NumeroPari (src as Object, e as ServerValidateEventArgs)
Dim num as Integer
num = Integer.Parse(e.Value)
e.IsValid = ((num mod 2)=0)
End Sub
</script>
</head>
Corpo
<body>
<form>
<asp:Textbox id=“txtNumero” runat=“server” />
<asp:CustomValidator id=“ConvalidatxtNumero”
ControlToValidate = “txtNumero”
onServerValidate = “NumeroPari”
Display=“Static”
ErrorMessage=“Inserisci un numero pari”
runat = “server” />
<br>
<asp:Label id=“Msg” runat=“server” />
<br>
<asp:Button Text=“Convalida” onClick=“Convalida” runat=“server”
/>
</form>
</body>
</html>
Validation Summary (1)
 Se il controllo di validazione intercetta un errore, questo
viene visualizzato al momento di esecuzione del controllo
con modalità indicata dalla proprietà Display.
 Si possono visualizzare tutti questi eventuali messaggi in
un unico punto della pagina con il controllo
ValidationSummary
 La proprietà IsValid dell’oggetto Page è True quando
tutti i controlli di validazione sono stati soddisfatti
Validation Summary (2)
 Se si mette un ValidationSummary sulla Web Form,
quando la proprietà IsValid dell’oggetto Page è
False, vengono automaticamente interrogati tutti i
controlli di validazione e gli eventuali messaggi di
errore sono raccolti e visualizzati nel controllo
ValidationSummary.
 Con il ValidationSummary i messaggi non sono
visualizzati direttamente, a meno che non siano
specificati tra i tag di apertura e chiusa.
ValidationSummary: Proprietà
 DisplayMode: Indica come si visualizzano i messaggi di errore




nella lista. Valori: BulletList, List, SingleParagraph
HeaderText: Intestazione della lista dei messaggi di errore.
ShowSummary: Indica se visualizzare o meno la lista dei messaggi
sulla pagina, valore predefinito True.
ShowMessageBox: Indica se la lista dei messaggi deve essere
visualizzata in una messagebox, valore predefinito False .
EnableClientScript: Se posta a False la validazione client
side è inibita, togliendo effetto alle impostazioni di
ShowMessageBox.