Parte IV
Programmazione di database e per
il Web
In questa parte:
Capitolo 18 Introduzione ad ADO.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 441
Capitolo 19 Presentazione dei dati mediante il controllo DataGridView. . . . . . . 467
Capitolo 20 Creazione di siti e pagine Web con Visual Web Developer
e ASP.NET . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 491
In questa parte, apprenderai come utilizzare le informazioni memorizzate in database e siti Web.
Per prima cosa, affronteremo l'argomento Microsoft ADO.NET, un importante modello per l’uso
di informazioni provenienti da database, e imparerai come visualizzare, modificare ed esaminare il
contenuto di un database utilizzando una combinazione di codice e controlli dei Windows Form.
Microsoft Visual Studio 2010 è stato progettato specificamente per creare applicazioni in grado di
fornire l’accesso a un’ampia varietà di origini dati. Tradizionalmente, queste interfacce personalizzate
vengono chiamate database front end per indicare che con le applicazioni sviluppate in Microsoft
Visual Basic, l’utente può consultare le informazioni contenute nel database e disporre di funzionalità
che vanno ben oltre la semplice manipolazione dei record presenti al suo interno. In Visual Studio
2010 è possibile creare applicazioni incentrate sui dati; ciò significa che mediante l’applicazione,
l’utente è invitato a esplorare l’intero potenziale di un numero qualsiasi di connessioni a origini dati,
sia locali sia remote, e che l’applicazione pone tali dati al centro delle attività svolte dall’utente sul
computer.
439
Capitolo 18
Introduzione ad ADO.NET
Al termine di questo capitolo sarai in grado di:
■
Utilizzare la procedura Configurazione guidata origine dati per stabilire una connessione con
un database e creare un dataset.
■
Utilizzare le finestre Progettazione DataSet e Origini dati per esaminare i membri di un dataset
e creare, nei form, oggetti a loro associati.
■
Creare applicazioni incentrate sui dati utilizzando dataset e oggetti per esplorare i dati.
■
Utilizzare controlli TextBox e MaskedTextBox per visualizzare le informazioni dei database in un
form.
■
Creare query SQL per filtrare e ordinare le informazioni dei dataset tramite lo strumento
Generatore di query di Visual Studio.
In questo capitolo vengono illustrate le prime fasi dell’uso di ADO.NET e delle applicazioni
incentrate sui dati. La procedura Configurazione guidata origine dati sarà impiegata per stabilire
una connessione con un database Microsoft Access presente sul sistema, quindi verrà creato un
dataset che rappresenti un sottoinsieme di campi e record di una tabella di database; le finestre
Progettazione DataSet e Origini dati saranno usate per esaminare i membri di un dataset e creare
oggetti associati nei propri form. Inoltre, verrà illustrato anche come utilizzare i controlli TextBox e
MaskedTextBox per restituire le informazioni dei database agli utenti, e come creare istruzioni SQL
(Structured Query Language) SELECT in grado di filtrare i dataset e di conseguenza ciò che gli utenti
potranno vedere e utilizzare.
Programmazione di database con ADO.NET
Un database è una raccolta organizzata di informazioni memorizzata in un file. Oggi esiste una
grande varietà di prodotti che permettono di creare potenti database, tra cui Microsoft Access,
Microsoft SQL Server e Oracle. Se necessario, è possibile anche memorizzare e inviare le informazioni
dei database tramite XML (Extensible Markup Language), un formato di file progettato per lo
scambio di dati strutturati via Internet e in altri ambiti.
La creazione e la gestione dei database è diventata un’attività fondamentale per tutte le principali
grandi aziende, gli enti governativi, le agenzie no-profit e la maggior parte delle piccole imprese.
Nel mondo del lavoro è sempre più importante poter disporre di grandi quantità di dati, ad esempio
indirizzi di clienti, inventari, bilanci contabili, record relativi ai dipendenti o la cronologia degli ordini
ricevuti.
441
442 Parte IV Programmazione di database e per il Web
Per creare nuovi database è possibile servirsi di Visual Studio 2010, anche se questo strumento
è concepito principalmente per visualizzare, analizzare e manipolare le informazioni contenute
in database esistenti. ADO.NET, introdotto la prima volta in Microsoft Visual Studio .NET 2002,
rappresenta ancora il modello standard per la programmazione di database in Visual Studio 2010.
Negli anni, questo strumento è stato sviluppato, affinché potesse funzionare con numerosi scenari
di accesso dati, e ottimizzato in modo specifico per l'utilizzo di Internet. Ad esempio, utilizza lo
stesso metodo base per l’accesso a origini dati locali, client-server e basate su Internet, e sfrutta
XML per il formato interno dei propri dati.
Fortunatamente, la maggior parte delle applicazioni create dai programmatori con Microsoft
Visual Basic 2008 e ADO.NET continuano a funzionare in modo ottimale e le tecniche di base per
l'accesso a un database sono rimaste quasi del tutto uguali anche in Visual Basic 2010. Tuttavia, in
Visual Studio 2010 sono state introdotte due nuove tecnologia database estremamente utili per i
programmatori più esperti. Queste tecnologie sono LINQ (Language-Integrated Query) e ADO.
NET Entity Framework.
LINQ fa parte di Visual Studio 2010 e offre la possibilità di creare query di database orientate agli
oggetti direttamente nel codice Visual Basic. ADO.NET Entity Framework introduce un nuovo
modello di oggetto, nuove e potenti funzionalità e strumenti in grado di liberare ulteriormente
le applicazioni per database dalla dipendenza da parti di codice create manualmente e legate a
una particolare piattaforma dati o modello logico. Con la costante evoluzione della tecnologia
dei database e di Internet, ADO.NET continuerà a evolversi e i programmatori di Visual Basic
dovrebbero essere in grado di sfruttare positivamente queste innovazioni.
Terminologia per i database
Il tema conduttore della sezione precedente è che i programmatori di database si trovano spesso
a dover affrontare nuove tecnologie da assimilare e padroneggiare, un processo che spesso viene
avviato dai termini nuovo paradigma o nuovo modello di database. Nonostante la continua
necessità di imparare nuove tecniche possa essere fonte di frustrazione, il ritmo rapido di questo
cambiamento può essere spiegato, in parte, con la relativa novità della programmazione di
applicazioni per database distribuite e multi-livello per Windows, assieme a innovazioni tecniche,
requisiti di protezione e specifiche per la programmazione per il Web, che non sono controllabili
da parte del team di sviluppo di Visual Studio. Per questi motivi, il capitolo parte dall’inizio, poiché
più di ogni altro argomento, la programmazione dei database deve essere trattata con argomenti
passo per passo. Si inizia quindi esaminando la terminologia base dei database.
Il campo (chiamato anche colonna) è una categoria di informazioni memorizzate in un database.
Normalmente, i campi di un database relativo ai membri di una facoltà comprendono numeri
ID, nomi dei membri, indirizzi di posta elettronica, numeri del telefono e nomi dei dipartimenti.
L’insieme di tutte le informazioni relative a un particolare membro della facoltà, viene chiamato
record (o meno frequentemente riga). Quando viene creato il database, le informazioni vengono
immesse in una tabella formata da campi e record.
Capitolo 18
Introduzione ad ADO.NET
443
I record corrispondono alle righe della tabella, mentre i campi corrispondono alle colonne, come
mostrato nel seguente database di facoltà (Faculty2010) di Access 2007.
Un database relazionale può essere formato da più tabelle collegate. Solitamente, la maggior
parte dei database cui è possibile connettersi da Visual Studio è del tipo relazionale e contiene più
tabelle di dati organizzati attorno a un tema particolare.
In ADO.NET sono presenti vari oggetti utilizzati per richiamare e modificare le informazioni
contenute in un database. Per prima cosa viene stabilita una connessione che specifica le
informazioni di connessione necessarie per quel database e crea ciò a cui altri controlli e
componenti si dovranno associare. Fatto ciò, la procedura Configurazione guidata origine dati
crea un dataset, cioè una rappresentazione di una o più tabelle del database che si prevede di
utilizzare nel programma. (Infatti, nel programma vengono manipolate le copie dei dati e non
i dati stessi.) La procedura Configurazione guidata origine dati aggiunge anche un file schema
XML al progetto e associa un table adapter e un data navigator al dataset, in modo da gestire il
richiamo dei dati dal database, la memorizzazione delle modifiche e lo spostamento da un record
al successivo all’interno del dataset. A questo punto è possibile associare le informazioni del
dataset ai controlli di un form utilizzando la finestra Origini dati o le impostazioni della proprietà
DataBindings.
444 Parte IV Programmazione di database e per il Web
Anche se in questo capitolo verrà illustrato come avviene tale processo in un'applicazione
Windows Form, in Visual Basic 2010 è possibile anche associare informazioni dataset ad
applicazioni client WPF (Windows Presentation Foundation) e ad applicazioni Web (ASP.NET o
Silverlight). Maggiori informazioni su database e ASP.NET verranno illustrate nel capitolo 20.
Utilizzo di un database Access
Nelle sezioni seguenti, apprenderai come utilizzare la tecnologia di accesso ai dati ADO.NET di
Visual Basic 2010. Inizierai con la Configurazione guidata origine dati per stabilire una connessione
a un database chiamato Faculty2010.accdb, creato in formato Access 2007. (Funziona anche
in Access 2010, la versione più recente di Access.) Faculty2010.accdb contiene varie tabelle
di informazioni relative alla vita accademica, utili per amministratori o insegnanti che devono
organizzare programmi di facoltà o suddividere il carico di lavoro, oltre a informazioni di contatto
importanti per gli impiegati di un'università o di una scuola.
Di seguito è possibile apprendere come creare un dataset basato su una tabella di informazioni
del database Faculty2010, quindi visualizzare tali informazioni in un Windows Form. Al termine,
sarà possibile sfruttare queste nozioni nei propri progetti di database.
Suggerimento Anche se gli esempi di questo capitolo utilizzano un database Access, non è
necessario avere installato questo programma. Tuttavia, in base alla configurazione del sistema,
possono servire alcuni componenti di connettività di Microsoft per utilizzare i file Access. Se nel
tentativo di completare gli esercizi sottoriportati visualizzi un messaggio di errore nel quale è indicato
che Microsoft.Jet.OLEDB non risulta registrato nel computer o che è impossibile riconoscere il formato
database Access, prima di poter utilizzare ADO.NET dovrai completare la fase 1 illustrata di seguito
per installare i componenti di connettività necessari, Inoltre, ricorda che Faculty2010.accdb è scritto
in formato Access 2007. Se desideri aprire il file in Access per utilizzarlo, dovrai avere Access 2007 o
Access 2010 installato nel sistema.
Stabilire una connessione utilizzando la procedura Configurazione guidata origine
dati
1. Accertati di aver installato Access 2007 o versione successiva. Se non hai Access 2007, scarica
e installa System Driver: Data Connectivity Components 2007 dal sito Microsoft.com.
2. Avvia Visual Studio e crea un nuovo progetto Applicazione Windows Form di Visual Basic
chiamato My ADO Faculty Form.
Il progetto viene aperto nell’IDE.
3. Nel menu Dati, fai clic sul comando Aggiungi nuova origine dati.
Capitolo 18
Introduzione ad ADO.NET
445
La procedura Configurazione guidata origine dati viene avviata nell’ambiente di sviluppo,
come mostrato nell’immagine che segue.
Questa procedura guidata è una funzionalità dell’IDE di Visual Studio 2010 che prepara
automaticamente il tuo programma in Visual Basic a ricevere le informazioni provenienti
da un database. La procedura chiede il tipo di database cui ci si deve connettere (locale o
remoto, servizio Web, oggetto dati personalizzato creato personalmente o sito Microsoft
SharePoint), stabilisce la connessione ai dati e infine crea un dataset o un'entità dati all’interno
del programma in cui memorizzare tabelle e campi specifici del database. Come risultato, la
procedura guidata apre la finestra Origini dati e la riempie con una rappresentazione visiva di
ogni oggetto del database che può essere utilizzato nel programma.
4. Fai clic sull’icona Database (se non è già selezionata) nella procedura Configurazione guidata
origine dati, quindi su Avanti.
La procedura visualizza una schermata che chiede di scegliere un modello database per
l'applicazione e la connessione utilizzata dal programma per le informazioni contenute
nel database. Si tratta di una nuova schermata di Visual Studio 2010; a questo punto, puoi
scegliere tra Dataset o Entity Data Model.
Qui, utilizzerai Dataset, tuttavia anche Entity Data Model potrebbe rivelarsi utile perché
consente agli sviluppatori di utilizzare nel form dati di oggetti e proprietà specifici di un
dominio, senza preoccuparsi del formato delle tabelle e delle colonne database sottostanti.
L'opzione Entity Data Model è presente grazie ad ADO.NET Entity Framework, che
rappresenta un sottoinsieme della tecnologia database di ADO.NET.
446 Parte IV Programmazione di database e per il Web
5. Fai clic su Dataset e poi su Avanti.
La procedura guidata visualizza una schermata che permette di stabilire la connessione con il
database creando un’istruzione chiamata stringa di connessione. Ogni stringa di connessione
contiene le informazioni necessarie a Visual Studio per aprire ed estrarre le informazioni
da un database. Queste comprendono un percorso e un nome di file, ma anche alcuni dati
potenzialmente riservati quali un nome utente e una password.
Per questo motivo, la stringa di connessione viene trattata con la massima attenzione nella
procedura Configurazione guidata origine dati, e si raccomanda di proteggere dagli accessi
non autorizzati i file sorgenti copiati da un’ubicazione all’altra.
6. Fai clic sul pulsante Nuova connessione.
La prima volta che fai clic sul pulsante Nuova connessione, viene visualizzata la finestra di
dialogo Seleziona origine dati che chiede di selezionare il formato di database che prevedi
di utilizzare. Se compare la finestra di dialogo Aggiungi connessione invece della finestra di
dialogo Seleziona origine dati, ciò significa solamente che la copia di Visual Studio è già stata
configurata per un particolare formato di database.
In questo caso, fai semplicemente clic sul pulsante Modifica nella finestra di dialogo Aggiungi
connessione e visualizzerai la stessa finestra apparsa la prima volta che hai avviato la
procedura guidata, ad eccezione del fatto che la barra del titolo indica Modifica origine dati.
In questo esempio, comunque, si presuppone che sia stato già selezionato un formato di
origine dati, quindi la schermata visualizzata sarà uguale all'immagine seguente:
La finestra di dialogo Modifica/Seleziona origine dati è il luogo in cui puoi selezionare il
formato di database preferito, quello cioè che Visual Studio deve utilizzare come predefinito.
In questo capitolo, devi selezionare il formato di Access, ma ricorda che questa impostazione
può essere modificata in qualsiasi momento. Se necessario, all’interno di un singolo single
progetto puoi anche stabilire più connessioni, ognuna con un tipo di database differente.
Capitolo 18
Introduzione ad ADO.NET
447
7. Fai clic su File di database Microsoft Access, quindi su Continua (o su OK).
Viene visualizzata la finestra di dialogo Aggiungi connessione, mostrata nell’immagine che
segue:
Ora puoi procedere a specificare il percorso e le impostazioni di connessione del database,
affinché Visual Studio possa creare una stringa di connessione valida.
8. Fai clic su Sfoglia.
Viene visualizzata la finestra di dialogo Seleziona file di database Microsoft Access, che
funziona come una normale finestra di dialogo Apri.
9. Cerca la cartella C:\vb10sbs\Chap18 e seleziona il database Faculty2010, quindi fai clic su Apri.
Fatto ciò, hai selezionato il database in formato Access 2007 fornito per dimostrare come
vengono visualizzati i campi e i record di un database all’interno di un programma Visual
Basic. La finestra di dialogo Aggiungi connessione viene visualizzata nuovamente con il
percorso specificato. L'accesso a questo file non è stato limitato in alcun modo, pertanto non
è necessario digitare un nome utente e una password. Tuttavia, se il database richiede un
nome utente, una password, o entrambi, puoi specificarli adesso nella caselle Nome utente e
Password. Così facendo, questi valori vengono inclusi nella stringa di connessione.
10. Fai clic sul pulsante Test connessione.
Visual Studio tenta di aprire il database specificato con la stringa di connessione creata dalla
procedura guidata. Se il database fa uso di un formato riconosciuto e le informazioni su nome
utente e password (se presenti) sono corrette, viene visualizzato il messaggio illustrato nella
pagina seguente.
448 Parte IV Programmazione di database e per il Web
Nota Se visualizzi un messaggio che indica l'impossibilità di riconoscere il formato database
significa che probabilmente non è installato Access 2007 o versione successiva In questo caso,
scarica e installa Office System Driver: Data Connectivity Components 2007 dal sito Microsoft.
com. (Vedere la fase 1 sopra.)
11. Fai clic su OK per chiudere la finestra, quindi nuovamente su OK per chiudere la finestra di
dialogo Aggiungi connessione.
Visual Studio visualizza nuovamente la procedura Configurazione guidata origine dati.
12. Fai clic sul segno più (+) accanto alla voce Stringa di connessione nella finestra di dialogo per
visualizzare la stringa di connessione completata.
La pagina della procedura guidata appare simile a quella mostrata di seguito:
La stringa di connessione identifica un provider (noto anche come provider gestito)
chiamato Microsoft.ACE.OLEDB.12.0, il quale è un componente il cui compito è di gestire la
connessione a un database per estrarne i dati. I due provider più usati forniti da Visual Studio
sono Microsoft OLE DB e SQL Server, ma ve ne sono molti altri disponibili, forniti da terze
parti per i formati di database più diffusi.
Capitolo 18
Introduzione ad ADO.NET
449
13. Fai clic sul pulsante Avanti.
La procedura guidata visualizza un messaggio di avviso nel quale è indicato che è stato
selezionato un nuovo database locale che non fa parte del progetto corrente e chiede se
tale database deve essere copiato nelle cartelle del progetto. Questo messaggio appare
solo la prima volta che viene stabilita una connessione con un database locale. Pertanto è
probabile che tale messaggio non compaia nuovamente se l’esercitazione viene ripetuta.
In un'applicazione commerciale che utilizza un database, è meglio controllare questo
funzionamento con attenzione. (Per maggiori informazioni sulle opzioni, seleziona il pulsante
? o premi F1.)
14. In questo caso, fai clic su No per evitare di creare una copia aggiuntiva del database.
Poiché questo progetto è solo un programma di esempio e non dovrà essere distribuito,
questa copia extra non è necessaria.
La procedura Configurazione guidata origine dati pone quindi la seguente domanda:
“Salvare la stringa di connessione nel file di configurazione dell’applicazione?” La
risposta predefinita è affermativa, e il nome della stringa proposto in questo esempio è
Faculty2010ConnectionString. Solitamente si desidera salvare questa stringa all’interno del file
di configurazione dell’applicazione, poiché se l’ubicazione del database cambia è possibile
modificarla in tale file (disponibile in Esplora soluzioni) invece di dover tenere traccia della
stringa di connessione nel codice del programma e di dover ricompilare l’applicazione stessa.
15. Fai clic su Avanti per salvare la stringa di connessione predefinita.
A questo punto il programma chiede di selezionare il sottoinsieme di oggetti database che
desideri utilizzare in questo progetto, come mostrato nella finestra di dialogo che segue:
450 Parte IV Programmazione di database e per il Web
Nota Visual Studio consente di utilizzare solo una parte di un database, oppure di combinare
database differenti, una funzionalità utile quando è necessario creare applicazioni incentrate sui
dati.
Gli elementi selezionati in questa finestra di dialogo vengono indicati all’interno del progetto
come oggetti database. Gli oggetti database possono comprendere tabelle di campi e record,
viste, stored procedure, funzioni e altri elementi univoci del database. Il termine che riunisce
tutti gli oggetti database selezionati è dataset. In questo progetto, al dataset viene assegnato
il nome predefinito Faculty2010DataSet che può essere modificato nella casella Nome
DataSet.
Suggerimento Nota che il dataset creato ora è solamente una rappresentazione dei dati
presenti nel database; infatti, se aggiungi, elimini o modifichi i record del database nel dataset,
in realtà le tabelle del database sottostante vengono modificate solo quando esegui un comando che memorizza tali variazioni nel database originale. I programmatori di database chiamato
questo tipo di comportamento origine dati disconnessa, per indicare che è presente un livello di
separazione tra il database reale e il dataset.
16. Fai clic sulla freccia accanto al nodo Tabelle per espandere l’elenco delle tabelle presenti nel
database Faculty2010.accdb.
In questo caso, la tabella presente è una sola, chiamata Faculty, che utilizzerai nel programma
di esempio.
17. Fai clic sulla freccia vicina al nodo Faculty, quindi seleziona le caselle di controllo dei campi
Last Name eBusiness Phone.
Questi due campi saranno aggiunti al dataset Faculty2010DataSet. La procedura guidata
dovrebbe risultare simile alla seguente:
Capitolo 18
Introduzione ad ADO.NET
451
18. Fai clic sul pulsante Fine per completare e chiudere la procedura Configurazione guidata
origine dati.
Visual Studio completa l’aggiunta al progetto della connessione al database e la
configurazione del dataset con gli oggetti database selezionati. (A seconda di come è stata
utilizzata e configurata l’IDE di Visual Studio, possono essere visualizzate la scheda o la
finestra Origini dati.)
19. Fai clic sul pulsante Salva tutto nella barra degli strumenti standard per salvare le modifiche.
Specifica il percorso della cartellaC:\Vb10sbs\Chap18.
20. Se Esplora soluzioni non è completamente visibile, aprilo per visualizzare i file e i componenti
principali presenti nel progetto ADO Faculty Form.
Lo schermo sarà simile al seguente:
Oltre alle normali voci presenti in Esplora soluzione per un progetto, visualizzerai un nuovo
file chiamato Faculty2010DataSet.xsd. Si tratta di uno schema XML che descrive le tabelle, i
campi, i tipi di dati e gli altri elementi del dataset creato. La presenza del file dello schema
significa che al progetto è stato aggiunto un dataset tipizzato. (I dataset tipizzati sono
associati a un file di schema, cosa che non avviene per i dataset non tipizzati.) I dataset
tipizzati sono convenienti perché abilitano la funzione Microsoft IntelliSense dell’editor di
codice di Visual Studio e forniscono informazioni specifiche sui campi e le tabelle utilizzati.
21. Fai clic sul file dello schema Faculty2010DataSet.xsd in Esplora soluzioni, quindi sul pulsante
Visualizza finestra di progettazione.
La rappresentazione di tabelle, campi e comandi data adapter relativi al nuovo dataset
viene visualizzata in uno strumento chiamato finestra Progettazione DataSet. La finestra
Progettazione DataSet contiene strumenti che permettono di creare componenti che
consentono al database di comunicare con l’applicazione, ciò che i programmatori di
database chiamano componenti del layer di accesso ai dati. La finestra Progettazione DataSet
permette di creare e modificare i table adapter e le loro query, le tabelle e le colonne di
dati e le relazioni tra dati. La finestra Progettazione DataSet può essere impiegata anche
452 Parte IV Programmazione di database e per il Web
per rivedere e impostare importanti proprietà relative agli oggetti di un dataset, come ad
esempio la lunghezza dei campi di un database e i tipi di dati associati ai campi.
22. Fai clic sul campo Last Name e premi F4 per passare alla finestra Proprietà.
23. Fai clic sulla proprietà MaxLength. Il form dovrebbe risultare simile all'immagine seguente:
In questa immagine, la finestra Progettazione DataSet è mostrata con un dataset attivo
chiamato Faculty2010DataSet, mentre la finestra Proprietà mostra che la proprietà MaxLength
è impostata in modo da consentire un massimo di 50 caratteri nel campo Last Name.
Nonostante tale lunghezza possa sembrare sufficiente, è possibile modificare questa
proprietà (o altre) qualora le impostazioni del database sottostante risultino inadeguate per
l’applicazione.
Lasciando temporaneamente da parte la finestra Progettazione DataSet, la prossima sezione
prosegue con la creazione dell’applicazione database di esempio nella finestra Origini dati.
La finestra Origini dati
La finestra Origini dati è una utile funzione dell’IDE di Visual Studio 2010 che permette di
risparmiare tempo. Il suo scopo è di mostrare una rappresentazione visiva dei dataset configurati
per essere utilizzati nel progetto, aiutando ad associare tali dataset con i controlli presenti nel
form.
Capitolo 18
Introduzione ad ADO.NET
453
È utile ricordare che un dataset è solamente una rappresentazione temporanea delle informazioni
di un database, e che ogni dataset contiene solo un sottoinsieme delle tabelle e dei campi
presenti nell’intero database; pertanto, al suo interno vengono visualizzati solamente gli elementi
selezionati nella procedura Configurazione guidata origine dati. Il dataset viene mostrato sotto
forma di una struttura gerarchica nella finestra Origini dati, con un nodo principale per ogni
oggetto selezionato nella procedura guidata. Ogni volta che esegui la procedura guidata per
creare un nuovo dataset, alla finestra Origini dati viene aggiunta una nuova struttura dataset,
offrendo così la possibilità di accedere a un’ampia gamma di origini e visualizzazioni dati da un
unico programma.
Se hai seguito le istruzioni per la selezione dei campi nella tabella Faculty del database
Faculty2010, ora disponi di informazioni interessanti da visualizzare nella finestra Origini dati. Per
prepararti agli esercizi che seguono e vedere la finestra Origini dati, visualizza nuovamente il form
facendo clic sulla scheda Form1.vb [Progettazione], quindi fai clic sul comando Mostra origini dati
nel menu Dati. (In alternativa puoi fare clic sulla scheda Origini dati, se visibile.)
Una volta aperta la finestra Origini dati, espandi la tabella Faculty in modo da poter vedere i due
campi selezionati. La finestra Origini dati dovrebbe avere il seguente aspetto:
Nella parte superiore della finestra sono presenti quattro utili strumenti che consentono di
utilizzare i dataset. Essi consentono, da sinistra a destra, di aggiungere un nuovo dataset al
progetto, modificare il dataset selezionato in Progettazione DataSet, aggiungere o rimuovere
campi dataset e aggiornare il dataset.
Il modo più semplice per visualizzare le informazioni di un dataset in un form e agli utenti consiste
nel trascinare gli oggetti dalla finestra Origini dati alla finestra Progettazione Windows Form.
(Questa è la stessa finestra di progettazione usata nei capitoli precedenti, ma qui viene chiamata
Progettazione Windows Form per distinguerla dalla finestra Progettazione DataSet.)
Il capitolo 19, descrive come visualizzare intere tabelle di dati in un form. Il resto di questo
capitolo mostra invece come trascinare singoli campi di dati nei controlli associati di Progettazione
Windows Form per collegare i campi del database Faculty2010. Provaci.
454 Parte IV Programmazione di database e per il Web
Utilizzo della finestra Origini dati per creare oggetti database in un form
1. Nella finestra Origini dati, fai clic sulla freccia vicina al nodo Faculty per visualizzare i campi
disponibili in Faculty2010DataSet (se non l'hai già fatto).
La finestra Origini dati appare come nell’immagine precedente. In Visual Studio 2010, puoi
visualizzare singoli campi o un’intera tabella di dati semplicemente trascinando nel form gli
oggetti database desiderati.
2. Fai clic sul campo Last Name che contiene il nome di ciascun docente presente nel database
Faculty2010. Nella finestra Origini dati, a destra del campo Last Name viene visualizzata una
freccia. Se la freccia non risulta visibile, assicurati che nella finestra di progettazione sia attiva
la scheda Form1.vb [Progettazione], quindi fai nuovamente clic su Last Name.
3. Fai clic sulla freccia Last Name.
Questa operazione permette di visualizzare un elenco di opzioni relative al modo in cui
un campo di un database viene mostrato nel form quando lo trascini, come mostrato
nell’immagine che segue.
Anche se non ne abbiamo ancora discusso, la maggior parte dei controlli presenti nella
scheda Controlli comuni della Casella degli strumenti dispone della capacità incorporata di
visualizzare le informazioni dei database. Nella terminologia di Visual Studio, quando sono
connessi a campi abilitati all’uso di dati in un dataset, questi controlli vengono chiamati
controlli associati. L’elenco dei controlli ora visibili è un gruppo di opzioni comuni per la
visualizzazione di stringhe di informazioni da un database, ma in questo elenco puoi
aggiungere (o rimuovere) ulteriori controlli facendo clic sul comando Personalizza. In questo
caso tuttavia, devi usare semplicemente il controllo TextBox, cioè il controllo associato
predefinito per i dati stringa.
4. Fai clic su TextBox nell’elenco, quindi trascina il campo Last Name al centro del form in
Progettazione Windows Form.
Mentre trascini il campo sul form, un segno più (+) sotto al cursore indica che l’aggiunta
di questo oggetto database al form è un’operazione valida. Quando rilasci il pulsante del
Capitolo 18
Introduzione ad ADO.NET
455
mouse, Visual Studio crea un oggetto casella di testo abilitato all’uso dei dati e inserisce una
barra di navigazione dall’aspetto professionale nella parte superiore del form. Fatto ciò, il form
dovrebbe apparire simile a quanto mostrato nell’immagine che segue; nota che la finestra
Origini dati può trovarsi in una posizione differente:
In realtà, Visual Studio ha creato due oggetti per questo campo Last Name: un oggetto
etichetta descrittivo contenente il nome del campo, e un oggetto casella di testo associato
che durante l’esecuzione del programma sarà usato per visualizzare il contenuto del campo.
Nella barra dei componenti sotto al form, Visual Studio ha creato anche alcuni oggetti
necessari per gestire le operazioni interne del processo di accesso ai dati. Questi oggetti
comprendono:
❏
Faculty2010DataSet, il dataset creato con la procedura Configurazione guidata origine
dati per rappresentare i campi del database Faculty2010
❏
FacultyBindingSource, un componente intermedio che opera da tramite tra la tabella
Faculty e gli oggetti associati all’interno del form
❏
FacutlyTableAdapter e TableAdapterManager, componentI intermedi che spostano i
dati tra Faculty2010DataSet e le tabelle nel database Faculty2010 sottostante
❏
FacultyBindingNavigator, un oggetto che fornisce i servizi di navigazione e le
proprietà relative alla barra degli strumenti di navigazione e alla tabella Faculty
Ora puoi eseguire il programma per vedere come funzionano gli oggetti impiegati.
456 Parte IV Programmazione di database e per il Web
5. Fai clic sul pulsante Avvia debug nella barra degli strumenti standard.
Il programma ADO Faculty Form viene eseguito nell’IDE. L’oggetto casella di testo viene
caricato con il primo record Last Name presente nel database (Abercrombie), quindi nella
parte superiore del form appare una barra degli strumenti di navigazione con numerosi
pulsanti e controlli, come mostrato nell’immagine che segue:
Questa barra degli strumenti di navigazione costituisce una funzionalità utile degli strumenti
di programmazione database di Visual Studio 2010. Da sinistra a destra, essa contiene i
pulsanti Move First e Move Previous, un indicatore di posizione corrente e i pulsanti Move
Next, Move Last, Add New, Delete e Save Data. I pulsanti della barra possono essere
modificati o eliminati mediante le proprietà Items dell’oggetto binding navigator nella
finestra Proprietà, nella quale è visibile uno strumento chiamato Editor dell’insieme Items. Se
necessario, è anche possibile abilitare o disabilitare singoli pulsanti della barra.
6. Fai clic sul pulsante Move next per passare al nome del secondo docente nel dataset.
Viene visualizzato il record Pais.
7. Continua a scorrere i record del dataset uno alla volta. Mentre ti sposti nell’elenco di nomi,
nota che l’indicatore di posizione tiene traccia di dove ti trovi.
8. Fai clic sui pulsanti Move First e Move Last per passare rispettivamente al primo e all’ultimo
record del dataset.
9. Elimina l’ultimo record del dataset (Skinner) facendo clic sul pulsante Delete.
Il record viene eliminato dal dataset e l’indicatore di posizione mostra che ora rimangono 19
record. (Lan è diventato l’ultimo e corrente record.) Lo schermo sarà simile al seguente:
Capitolo 18
Introduzione ad ADO.NET
457
Come già discusso in precedenza, il dataset rappresenta solo un sottoinsieme delle tabelle del
database Faculty2010 utilizzato in questo progetto, e il dataset è un’immagine disconnessa
di tale database, non il database stesso. Di conseguenza, il record appena eliminato è stato
rimosso solamente dal dataset caricato in memoria durante l’esecuzione del programma.
Tuttavia, per verificare che il programma operi davvero su dati disconnessi e senza eseguire
alcuna modifica nel database originale, puoi interromperlo e riavviarlo ora.
10. Fai clic sul pulsante Chiudi nel form per terminare il programma.
Il programma viene terminato e il controllo torna all’IDE.
11. Fai clic su Avvia debug per eseguire nuovamente il programma.
Una volta avviato il programma e caricato il form, la barra degli strumenti di navigazione
mostra che il dataset contiene 20 record, come nell’originale. In altre parole, tutto funziona
come previsto.
12. Fai clic sul pulsante Move Last per visualizzare l’ultimo record del dataset.
Come puoi notare, il record Skinner è ancora presente. Il nome dell’ultimo docente era stato
eliminato solo dalla memoria e ora è ricomparso perché il database sottostante lo contiene
ancora.
13. Fai clic di nuovo sul pulsante Chiudi per terminare il programma.
Congratulazioni! Senza scrivere nemmeno una riga di codice, hai creato un’applicazione
funzionante che visualizza informazioni specifiche richiamate da un database. L’impostazione
del dataset ha richiesto numerose operazioni, ma ora esso è pronto per essere impiegato nel
programma in molti altri utili modi.
Pur avendo selezionato solamente una tabella e due campi del database Faculty2010 per
ridurre gli elementi visualizzati e concentrare l’attenzione, durante la creazione di dataset con
la procedura Configurazione guidata origine dati può essere necessario selezionare un numero
maggiore di oggetti database.
458 Parte IV Programmazione di database e per il Web
Come puoi vedere, non è necessario creare oggetti associati per ogni elemento dataset di un
form, ma è possibile decidere quali record del database utilizzare e visualizzare.
Utilizzo di controlli associati per visualizzare le
informazioni di un database
Come già discusso in precedenza, Visual Studio può utilizzare numerosi controlli della Casella
degli strumenti per visualizzare le informazioni dei database. Questi controlli possono essere
associati ai dataset trascinando i campi dalla finestra Origini dati (metodo più semplice), oppure è
possibile creare i controlli separatamente nei form per poi associarli agli oggetti dataset in seguito.
Questa seconda opzione è una funzione importante, poiché occasionalmente può capitare di
dover aggiungere le origini dati a un progetto solo dopo aver creato l’interfaccia utente. La
procedura dimostrata in questa sezione serve a gestire questo tipo di situazione, fornendo inoltre
un ulteriore esempio di utilizzo di oggetti dati associati ai controlli di un’applicazione Visual Basic.
Di seguito viene illustrato come creare un oggetto casella di testo mascherata, configurare tale
oggetto in modo da formattare le informazioni del database nel modo desiderato, e quindi
associare all’oggetto il campo Business Phone in Faculty2010DataSet.
Associazione di un controllo casella di testo mascherata a un oggetto dataset
1. Visualizza il form in Progettazione Windows Form, quindi apri la Casella degli strumenti, se
non è ancora visibile.
2. Faci clic sul controllo MaskedTextBox nella scheda Controlli comuni, quindi crea l'oggetto nel
form sotto l’etichetta e la casella di testo Last Name.
Come già discusso nel capitolo 6, il controllo MaskedTextBox è simile al controllo TextBox, ma
dispone di maggiori capacità di gestire o limitare le informazioni immesse nel programma
dall’utente. Il formato di immissione del controllo MaskedTextBox viene definito mediante la
proprietà Mask. In questa esercitazione, la proprietà Mask viene impiegata per preparare la
casella di testo a visualizzare numeri di telefono formattati provenienti dal campo Business
Phone. (Per impostazione predefinita, nel database Faculty2010 i numeri di telefono sono
memorizzati senza spazi, parentesi o trattini usati nei formati telefonici, ma si desidera che nel
programma sia usato questo tipo di formattazione.)
3. Fai clic sullo smart tag nell’angolo superiore destro dell’oggetto casella di testo, quindi fai clic
sul comando Imposta maschera.
Visual Studio visualizza la finestra di dialogo Maschera input che elenca alcuni tipi di maschere
numeriche predefinite. Oltre che per le informazioni immesse dagli utenti, Visual Studio
utilizza queste maschere per formattare i dati di output nell’oggetto casella di testo.
4. Fai clic sulla maschera di input Numero di telefono, quindi su OK.
L’oggetto ora appare con le indicazioni per l’immissione associate alle impostazioni di paese e
lingua memorizzate in Windows. (Queste impostazioni possono variare a seconda del paese
di appartenenza.)
Capitolo 18
Introduzione ad ADO.NET
459
5. Aggiungi un oggetto etichetta accanto al nuovo oggetto e impostane la proprietà Text su
“Phone:” (inclusi i due punti).
La prima etichetta descrittiva è stata aggiunta automaticamente dalla finestra Origini dati,
mentre questa deve essere aggiunta manualmente.
6. Imposta lo spazio tra etichette e caselle di testo in modo da allinearle in modo uniforme. Al
termine, il form dovrebbe avere un aspetto simile a questo:
Ora puoi procedere ad associare il campo Business Phone di Faculty2010DataSet al nuovo
oggetto casella di testo. La procedura è semplice; è sufficiente trascinare il campo Business
Phone dalla finestra Origini dati nell'oggetto che si desidera associare ai dati, in questo caso
MaskedTextBox1.
7. Visualizza la finestra Origini dati se non è visibile, quindi trascina il campo Business Phone
nell’oggetto MaskedTextBox1.
Quando trascini un oggetto dataset su un oggetto già presente nel form (chiamato anche
oggetto di destinazione), non viene creato alcun nuovo oggetto associato. Al contrario, le
proprietà DataBindings dell’oggetto di destinazione vengono impostate in modo da farle
corrispondere all’oggetto dataset trascinato dalla finestra Origini dati.
Una volta completata l’operazione di trascinamento, l’oggetto casella di testo risulta associata
al campo Business Phone, e la proprietà Text dell’oggetto casella di testo contiene una piccola
icona di database nella finestra Proprietà, per indicare che l’oggetto è associato a un dataset.
8. Verifica che l’oggetto MaskedTextBox1 sia selezionato nel form, quindi premi il tasto F4 per
passare alla finestra Proprietà.
9. Cerca la categoria DataBindings, quindi fai clic sulla freccia per espanderla.
Visual Studio mostra la proprietà normalmente associata all’accesso ai dati in un oggetto
casella di testo mascherata. La finestra Proprietà dovrebbe essere simile a quella qui mostrata:
460 Parte IV Programmazione di database e per il Web
Nota la proprietà Text, che in seguito all’operazione di trascinamento risulta impostata su
FacultyBindingSource – Business Phone”. (Come puoi vedere, qui non è presente la piccola
icona di database, che appare solamente nella proprietà Text nella parte inferiore dell’elenco
alfabetico delle proprietà.) Inoltre, facendo clic sulla freccia nella proprietà Text, puoi vedere
la rappresentazione dell’oggetto casella di testo. (Se necessario, questa utile indicazione visiva
permette di modificare rapidamente l’origine dati cui è associato il controllo.)
10. Fai clic sul form per chiudere tutti i riquadri aperti della finestra Proprietà.
11. Fai clic sul pulsante Avvia debug per eseguire il programma.
Visual Studio esegue il programma nell’IDE. Dopo qualche istante, i due campi del database
vengono caricati negli oggetti, come mostrato nell’immagine che segue.
È importante notare che l’oggetto casella di testo mascherata formatta correttamente le
informazioni relative al numero di telefono in base alle impostazioni usate da Windows.
Capitolo 18
Introduzione ad ADO.NET
461
12. Fai clic alcune volte sul pulsante Sposta avanti.
È stata dimostrata un’altra importante funzione: I due campi del dataset vengono
aggiornati insieme, e i nomi dei docenti vengono visualizzati con i rispettivi numeri telefonici
memorizzati nel database Faculty2010. Questa sincronizzazione viene gestita dall’oggetto
FacultyBindingNavigator, il quale tiene traccia del record corrente per ogni oggetto associato
presente nel form.
13. Fai clic sul pulsante Chiudi per interrompere il programma, quindi sul pulsante Salva tutto per
salvare le modifiche.
Hai così appreso come visualizzare più campi di un database in un form, utilizzare la barra degli
strumenti di navigazione per muoverti in un dataset e formattare le informazioni del database
mediante una maschera. Prima di lasciare questo capitolo per passare all’esame del controllo
DataGridView discusso nel capitolo 19, dedica qualche istante a vedere come personalizzare
ulteriormente il dataset utilizzando le istruzioni SQL.
Procedura aggiuntiva: istruzioni SQL, LINQ e filtro dei
dati
La procedura Configurazione guidata origine dati è stata impiegata per estrarre dal database
Faculty2010 solo le tabelle e i campi desiderati mediante la creazione di un dataset personalizzato
chiamato Faculty2010DataSet. Tuttavia, oltre a questo filtro i dati visualizzati dai controlli associati
possono essere organizzati e personalizzati ulteriormente utilizzando istruzioni SQL e Generatore
di query di Visual Studio. Questa sezione introduce questi strumenti.
Per gli utenti di Visual Basic che hanno familiarità con Access o SQL Server, il filtro dei dati
mediante istruzioni SQL non rappresenta una novità. Gli altri lettori devono invece considerare
le istruzioni SQL come comandi che permettono di estrarre, o filtrare, le informazioni da
una o più tabelle strutturate di un database. Il motivo dell’applicazione di questi filtri è molto
semplice: Così come gli utenti Web si trovano a dover affrontare ripetutamente enormi quantità
di dati provenienti da Internet, utilizzando di conseguenza parole chiave di ricerca mirate nei
propri browser per localizzare esattamente ciò che desiderano, i programmatori di database
devono spesso gestire tabelle contenenti decine di migliaia di record che devono essere filtrati
e organizzati per poter risultare utili per una particolare attività. L’istruzione SQL SELECT è un
meccanismo molto noto che permette di organizzare le informazioni contenute in un database.
Concatenando un gruppo di queste istruzioni, i programmatori possono creare direttive di ricerca
complesse, o query, che consentono di estrarre da un database solo i dati desiderati.
In seguito alla larga diffusione delle istruzioni SQL, le versioni precedenti di Visual Studio e delle
relative IDE sono state dotate del supporto per l’impiego delle istruzioni SQL. Visual Studio 2008
e 2010 dispongono di una nuova tecnologia chiamata LINQ (Language-Integrated Query) che
permette ai programmatori esperti di creare query in stile SQL nei database direttamente nel
codice Visual Basic. Nonostante LINQ rappresenti la tecnologia database principale in Visual
Studio, non è semplice da utilizzare se non si conosce in modo abbastanza approfondito l’uso
462 Parte IV Programmazione di database e per il Web
delle istruzioni SQL. L’esercitazione che segue illustra alcune di queste nozioni base utilizzando
una funzionalità di Visual Studio chiamata Generatore di query. Questo strumento aiuta il
programmatore a creare query di database ed è particolarmente utile per chi ha poca esperienza
pregressa nell’uso del codice SQL. Nell’esempio seguente, Generatore di query viene impiegato
per organizzare ulteriormente il dataset Faculty2010DataSet ordinandolo alfabeticamente.
Creazione di istruzioni SQL con Generatore di query
1. Nel form creato precedentemente, fai clic sull’oggetto Last_NameTextBox (il primo oggetto
associato creato per visualizzare i nomi dei docenti nel database Faculty2010).
2. Fai clic su Aggiungi query nel menu Dati.
Il comando Aggiungi query è disponibile quando nella finestra Progettazione è selezionato
un oggetto associato, ad esempio Last_NameTextBox. Viene visualizzata la finestra di dialogo
Generatore di criteri per la ricerca, come mostrato nell’immagine che segue:
Questa finestra di dialogo permette di organizzare e visualizzare le proprie query create da
Generatore di query e formate da istruzioni SQL. La tabella predefinita che viene organizzata
mediante la query (Faculty2010DataSet.Faculty) può essere selezionata nella casella Seleziona
tabella origine dati nella parte superiore della finestra di dialogo. Il nome della tabella indica
anche il formato gerarchico dell’oggetto, in questo caso “la tabella Faculty all’interno del
dataset Faculty2010DataSet”.
Capitolo 18
Introduzione ad ADO.NET
463
Eventuali altre tabelle tra cui scegliere sarebbero elencate nella casella di riepilogo che appare
facendo clic sulla freccia nella casella Seleziona tabella origine dati.
3. Digita SortLastNames nella casella Nuovo nome query.
Questa casella di testo assegna un nome alla query e forma la base dei pulsanti della
barra degli strumenti aggiunta al form. (Per facilitare l’accesso, la disposizione predefinita
prevede che le nuove query siano assegnate ai pulsanti della barra degli strumenti all’interno
dell’applicazione in fase di sviluppo.)
4. Fai clic sul pulsante Generatore di query nella finestra di dialogo per aprire lo strumento
Generatore di query.
Questo strumento consente di creare istruzioni SQL digitandole direttamente in una grande
casella di testo, oppure facendo clic su caselle di riepilogo e altri strumenti.
5. Nella riga Last Name che rappresenta il campo Last Name del dataset, fai clic sulla cella sotto
all’intestazione Tipo di ordinamento, quindi sulla freccia per visualizzare la casella di riepilogo
Tipo di ordinamento.
Lo schermo sarà simile al seguente:
6. Nella casella Tipo ordinamento, fai clic su Crescente.
I record saranno ordinati nel campo Last Name in modo ascendente.
464 Parte IV Programmazione di database e per il Web
7. Fai clic sulla casella di testo dell’istruzione SQL sotto il riquadro con la griglia per aggiornare la
finestra del Generatore di query.
Alla casella contenente le istruzioni SQL viene aggiunta una nuova clausola (ORDER BY [Last
Name]), e lo schermo appare simile a questo:
L'efficacia dello strumento Generatore sta nella capacità di creare istruzioni SQL in modo
automatico.
8. Fai clic su OK per completare la query.
Visual Studio chiude il Generatore di query e visualizza la nuova query nella finestra di dialogo
Generatore di criteri per la ricerca. Il nome della query (SortLastNames) appare nell’elenco
assieme alle istruzioni SQL che danno origine all’ordinamento.
9. Fai clic su OK per chiudere la finestra di dialogo Generatore di criteri per la ricerca e imposta
l’oggetto Last_NameTextBox in modo da visualizzare i nomi in ordine alfabetico ascendente.
Il processo ha creato anche un oggetto SortLastNamesToolStrip nella barra dei componenti
sotto al form. A questo punto, la finestra Progettazione e la barra dei componenti hanno
l’aspetto mostrato nell’immagine che segue.
Capitolo 18
Introduzione ad ADO.NET
465
10. Fai clic sul pulsante Avvia debug per eseguire il programma.
Visual Studio carica il form e visualizza il primo record dei due oggetti dataset.
11. Fai clic sul pulsante SortLastNames nella nuova barra degli strumenti.
La nuova istruzione SQL ordina i record Last Name del dataset e li visualizza nella nuova
sequenza. Il primo record è ancora Abercrombie, ma adesso il secondo e il terzo nome sono
rispettivamente Atlas e Bankov.
12. Fai clic sul pulsante Move Last nella barra degli strumenti.
Verrà visualizzato il nome Zimprich, come illustrato nella figura seguente.
466 Parte IV Programmazione di database e per il Web
Poiché i nomi sono elencati alfabeticamente da A a Z, Zimprich è diventato l'ultimo nome
della lista.
13. Scorri il resto dell’elenco dei record e verifica che i dati siano visualizzati in ordine alfabetico
ascendente.
14. Fai clic sul pulsante Chiudi per terminare il programma.
Nell’ultima sezione hai visto come creare query personalizzate mediante istruzioni SQL e
Generatore di query. La programmazione dei database è un argomento complesso, ma hai
già appreso molte nozioni utili per creare applicazioni Visual Basic incentrate sui dati, insiemi di
dati altamente personalizzati che possono aiutare l’utente a sfruttare le informazioni. L'analisi
dell'accesso ai dati viene ulteriormente approfondita nel capitolo 19. Nel capitolo 20, il progetto
finale visualizzerà i record database in un sito Web.
Riferimenti rapidi del capitolo 18
Obiettivo
Azione
Come stabilire una
connessione con un
database
Fai clic sul comando Aggiungi nuova origine dati nel menu Dati, quindi utilizza la procedura Configurazione guidata origine dati per localizzare il database cui desideri fornire accesso creando una stringa di connessione.
Creazione di un dataset
Con Configurazione guidata origine dati, specifica il nome del dataset nella
casella Nome DataSet, espandi il nodo Tabelle nella visualizzazione della
struttura del database mostrata e specifica le tabelle e i campi che desideri
includere nel dataset. (Nota che il dataset non deve necessariamente
includere tutte le tabelle e i campi del database.)
Creazione di oggetti
associati in grado di
visualizzare i dati di un
dataset in un Windows
Form
Dopo la procedura Configurazione guidata origine dati, apri la finestra
Origini dati e trascina le tabelle, i campi, o entrambi nel Windows Form. Per
controllare il tipo di associazione creata per la tabella o il campo, fai clic sulla
freccia relativa e seleziona un controllo nella casella di riepilogo prima di
procedere al trascinamento. Se hai posizionato un controllo nel form prima
di aggiungere le origini dati al progetto, puoi trascinare l’oggetto database
da associare dalla finestra Origini dati sul controllo desiderato all’interno
del form. In alternativa, imposta la proprietà DataBinding dell’oggetto
a un campo valido (colonna) del dataset. (Nota che una delle proprietà
DataBinding più utili è Text.)
Aggiunta di controlli di
navigazione a un
Windows Form
Quando un oggetto database valido viene trascinato dalla finestra
Origini dati in un Windows Form nella finestra di progettazione, viene
aggiunta automaticamente una barra degli strumenti di navigazione. Per
personalizzare i pulsanti presenti in questa barra degli strumenti, fai clic con
il pulsante destro del mouse sull’oggetto BindingNavigator nella barra dei
componenti, quindi fai clic su Modifica elementi.
Formattazione delle
informazioni di un
database in un form
Utilizza un controllo MaskedTextBox per formattare il contenuto di stringhe
di dati del dataset. Il controllo MaskedTextBox dispone di molte maschere di
input e della capacità di creare formati stringa personalizzati.
Come filtrare o ordinare le
informazioni di un
database memorizzate in
un dataset
Utilizza le istruzioni SQL per creare query personalizzate nel Generatore di
query di Visual Studio, quindi aggiungi queste query a una barra degli strumenti del Windows Form. Una volta appreso l’uso del Generatore di query, è
possibile procedere alla sperimentazione dell’uso di LINQ.
Capitolo 19
Presentazione dei dati mediante il
controllo DataGridView
Al termine di questo capitolo sarai in grado di:
■
Creare un oggetto visualizzazione griglia dati in un Windows Form e utilizzare l’oggetto per
visualizzare una tabella di un database.
■
Ordinare le tabelle di un database per colonna.
■
Modificare il formato e il colore delle celle in un oggetto visualizzazione griglia dati.
■
Aggiungere e rimuovere colonne e intestazioni di colonna.
■
Visualizzare più oggetti visualizzazione griglia dati in un form.
■
Abilitare le modifiche nelle celle di una griglia e salvare le modifiche nel database sottostante.
Nel capitolo 18, ho illustrato come utilizzare le tecniche di programmazione dei database di Microsoft
ADO.NET per stabilire una connessione con un database di Microsoft Access e visualizzare le
colonne di tale database in un Windows Form. Inoltre, ho mostrato come aggiungere una barra di
navigazione al form e come organizzare le informazioni del database mediante istruzioni SQL e lo
strumento Generatore di query.
In questo capitolo, apprenderai come sfruttare le funzionalità di programmazione dei database di
Microsoft Visual Studio 2010 utilizzando classi, oggetti e strumenti di progettazione in ADO.NET.
In particolare, dimostrerò come usare il controllo DataGridView per presentare all’utente un’intera
tabella di informazioni di un database.
Utilizzo di DataGridView per visualizzare i record di un
database
Il controllo DataGridView presenta le informazioni stabilendo una griglia di righe e colonne in un
form, in modo da visualizzare i dati come avviene in programmi quali Microsoft Excel o Access. Il
controllo DataGridView può essere impiegato per visualizzare qualsiasi tipo di dati tabellari, ad
esempio testo, numeri, date o contenuti di un array. In termini di programmazione, DataGridView
è utile anche perché data adapter e gli oggetti dataset sottostanti associati con DataGridView
gestiscono automaticamente tutta la funzionalità di accesso ai dati.
Questo capitolo si concentra sulla capacità del controllo DataGridView di visualizzare le colonne
(campi) e le righe (record) del database Faculty2010.accdb, un file di informazioni strutturate sui
dipendenti già utilizzato nel capitolo 18. Si inizia compilando un semplice oggetto visualizzazione
griglia dati con record di testo provenienti dal database Access 2007, per poi impostare alcune
opzioni di formattazione. Fatto ciò, si passa a ordinare i record negli oggetti griglia, per apprendere
467
468 Parte IV Programmazione di database e per il Web
poi come aggiungere più oggetti visualizzazione griglia dati in un form. Infine, si esamina come
impostare le proprietà DataGridView, tra cui la proprietà ReadOnly che consente o impedisce
all’utente di salvare le modifiche apportate nel database originale.
Il controllo DataGridView è connesso, o associato, ai componenti di accesso ai dati sottostanti
attraverso la proprietà BindingSource. Questa proprietà contiene informazioni solo dopo
che il programma ha stabilito una connessione con un’origine di dati valida utilizzando la
Configurazione guidata origine dati e la finestra Origini dati. Le operazioni necessarie per stabilire
questa connessione vengono riassunte brevemente di seguito, ma sono descritte in dettaglio nel
capitolo 18. Una volta associato l’oggetto visualizzazione griglia dati a un’origine di dati valida,
Visual Studio riempie, o popola, automaticamente la griglia utilizzando il metodo Fill quando il
form viene caricato in memoria.
Creazione della connessione con una tabella di un database
1. Avvia Visual Studio e crea un nuovo progetto Applicazione Windows Form di Visual Basic
chiamato My DataGridView Sample.
Il progetto viene aperto nell’IDE.
2. Fai clic sul comando Aggiungi nuova origine dati nel menu Dati.
Viene visualizzata la Configurazione guidata origine dati nell’ambiente di sviluppo. Questo
strumento è già stata impiegato nel capitolo 18 per collegare il progetto al database
Faculty2010.accdb e popolare la finestra Origini dati con tabelle e colonne presenti nel
database. In questo caso, è necessario selezionare un gruppo di informazioni più ampio dal
database Access di esempio.
3. Fai clic sull’icona Database, quindi su Avanti.
4. Fai clic sull’icona Dataset, quindi su Avanti.
La procedura guidata chiede di aggiungere una stringa di connessione, ma se hai
completato le esercitazioni del capitolo 18, il database Faculty2010.accdb viene specificato
automaticamente, come mostrato nell’immagine che segue.
Capitolo 19
Presentazione dei dati mediante il controllo DataGridView
469
Se sullo schermo non appare la connessione con il database Faculty2010, fai clic sul pulsante
Nuova connessione e localizza il file Faculty2010.accdb che si trova nella cartella C:\Vb10sbs\
Chap18. Per ulteriori informazioni, nel capitolo18 sono disponibili istruzioni dettagliate su
come stabilire la connessione.
5. Una volta evidenziata la stringa di connessione con Faculty2010.accdb, fai clic su Avanti.
La procedura guidata chiede se desideri salvare la stringa di connessione.
6. Fai clic su Avanti per salvare la stringa nel percorso predefinito, cioè nel file di configurazione
del progetto.
A questo punto il programma chiede di selezionare gli oggetti database da utilizzare per
questo particolare progetto. Ricorda che la Configurazione guidata origine dati ti consente
di scegliere le tabelle e le colonne di un database; pertanto puoi selezionare tutti gli oggetti
presenti nel database o solamente un loro sottoinsieme.
7. Espandi il nodo Tabelle e la tabella Faculty per vedere il lungo elenco dei campi del database
che contengono informazioni sui dipendenti della facoltà.
8. Seleziona i campi ID, Last Name, First Name, E-mail Address, Faculty ID, Department,
Faculty Type e Business Phone.
Anche se questo database Access è stato progettato per contenere tutti i tipi di informazioni
sui dipendenti della scuola, per i nostri scopi sono sufficienti i suddetti campi.
470 Parte IV Programmazione di database e per il Web
Suggerimento È importante includere il campo ID perché è la chiave primaria del database
Access in uso. La chiave primaria non deve essere visualizzata sul form, ma è necessario che
venga inclusa nel dataset in modo che le informazioni della tabella possano essere riscritte nel
database originale, qualora si scelga di concedere tale facoltà all'utente (le operazioni di salvataggio saranno illustrate alla fine del capitolo). Se non viene inclusa la chiave primaria, potrebbe
essere visualizzato un messaggio di errore quando si prova a riscrivere i dati nel database originale.
La pagina della procedura guidata dovrebbe apparire come mostrato nell’immagine che
segue.
9. Fai clic su Fine per chiudere la Configurazione guidata origine dati.
Visual Studio crea un dataset chiamato Faculty2010DataSet che rappresenta gli otto oggetti
database selezionati. Inoltre, Visual Studio aggiunge file XML chiamato Faculty2010DataSet.
xsd al tuo progetto e nella finestra Esplora soluzioni. A questo punto, hai stabilito la
connessione con il database Faculty2010.accdb che è possibile utilizzare per le esercitazioni
del resto di questo capitolo.
10. Fai clic sul pulsante Salva tutto nella barra degli strumenti standard per salvare il progetto.
Specifica la cartella C:\Vb10sbs\Chap19 come percorso di salvataggio.
11. Fai clic sulla scheda Origini dati per aprire la finestra Origini dati, quindi espandi il nodo
Faculty. Se la scheda non è visibile, fai clic sul comando Mostra origini dati nel menu Dati.
Capitolo 19
Presentazione dei dati mediante il controllo DataGridView
471
La finestra Origini dati visualizza gli oggetti presenti in Faculty2010DataSet, come mostrato
nell’immagine che segue.
Nel capitolo 18 si è visto come trascinare i singoli campi dalla finestra Origini dati a un Windows
Form per associare gli oggetti dati ai controlli dell’interfaccia utente. Nell’esercitazione che segue,
viene mostrata una procedura simile, ma in questo caso l’intera tabella verrà trascinata nel form,
per associarla al controllo DataGridView in modo che i campi che sono stati selezionati vengano
visualizzati contemporaneamente.
Creazione di un oggetto visualizzazione griglia dati
1. Ridimensiona il form in modo da fargli occupare la maggior parte dello schermo.
Prima della fine del capitolo, avrai posizionato nel form due oggetti visualizzazione griglia dati
affiancati, ognuno dei quali contenente più colonne e circa dieci righe di dati. Ricorda che il
form può essere più largo dello spazio allocato all’interno dell’IDE, e che pertanto può essere
necessario chiudere gli strumenti di programmazione o utilizzare le barre di navigazione per
vedere alcune parti del form nascoste. Tuttavia, si consiglia di tenere aperta la finestra Origini
dati per l’operazione che segue.
2. Nella finestra Origini dati, fai clic sulla tabella Faculty, quindi sulla freccia alla sua destra per
visualizzare l’elenco dei controlli che è possibile associare alla tabella Faculty nel form.
La finestra Origini dati dovrebbe avere il seguente aspetto:
472 Parte IV Programmazione di database e per il Web
Dal momento che hai selezionato un’intera tabella, in questa casella di riepilogo non è
possibile vedere i singoli controlli associati. Puoi invece vedere le seguenti opzioni:
❏
DataGridView (impostazione predefinita), che visualizza una griglia di colonne e righe
che rappresentano i campi e i record presenti nella tabella Faculty.
❏
Dettagli, che configura Visual Basic in modo da creare automaticamente i singoli
controlli (con le relative etichette) per ogni campo di una tabella trascinata nel form.
Anche se l’uso di Dettagli non viene discusso in questo capitolo, questa opzione
è utile quando si desidera presentare dati tabellari in un formato leggermente più
accessibile.
❏
Nessuno, che rimuove eventuali associazioni tra la tabella e un elemento
dell’interfaccia utente o un controllo. Selezionando Nessuno per una tabella, non sarai
in grado di trascinare tale tabella dalla finestra Origini dati al form, e accanto al nome
della tabella apparirà l’icona Null.
❏
Personalizza, che permette di selezionare un controllo differente adatto per la
visualizzazione di più campi del database, come ad esempio il controllo ListBox.
3. Fai clic sull’opzione DataGridView, quindi trascina la tabella Faculty sul lato sinistro del form.
Visual Studio crea una barra di navigazione nella parte superiore del form, aggiunge un
dataset, l’origine di associazione, un table adapter e i componenti del navigatore, quindi
crea nel form un oggetto visualizzazione griglia dati chiamato FacultyDataGridView. Il form
dovrebbe risultare simile alla figura seguente:
Capitolo 19
Presentazione dei dati mediante il controllo DataGridView
473
Come puoi vedere, in questo momento l'oggetto visualizzazione griglia dati non contiene
alcuna informazione, e probabilmente non è nemmeno delle dimensioni adatte. Ad
esempio, l’oggetto visualizzazione griglia dati dell’esempio non è abbastanza largo per
poter visualizzare le otto colonne. Tuttavia, puoi vedere chiaramente che Visual Studio ha
organizzato la tabella Faculty nella griglia per fare in modo che i campi appaiano come
colonne, mentre le righe rappresentano i singoli record. Per il primo record della tabella
viene riservata una riga vuota, mentre altre righe aggiuntive saranno aggiunte al momento
dell’esecuzione del programma con l’inserimento dei dati nella griglia.
4. Sposta e ridimensiona l’oggetto visualizzazione griglia dati in modo da visualizzare il maggior
numero possibile di colonne, lasciando spazio sufficiente per almeno dieci righe di dati.
In base alla risoluzione dello schermo, potrebbe essere necessario nascondere alcuni
strumenti di programmazione dell'IDE per eseguire questa operazione, oppure di utilizzare
le barre di navigazione dell'IDE di Visual Studio che compaiono quando lavori con finestre di
grandi dimensioni.
5. Utilizza la finestra Proprietà per impostare la proprietà Text del form su “The Faculty Table”.
Il form dovrebbe risultare simile al seguente:
474 Parte IV Programmazione di database e per il Web
Fatto ciò, hai completato le operazioni base necessarie per creare e dimensionare in modo
appropriato un oggetto visualizzazione griglia dati in un form. Tra breve visualizzerai l’anteprima
dei dati e personalizzerai la tabella. La possibilità di vedere l’anteprima dei dati e di modificare le
impostazioni base è semplificata dalla nuova funzione freccia.
Anteprima dei dati associati a un oggetto visualizzazione griglia dati
1. Seleziona l’oggetto visualizzazione griglia dati nel form, quindi fai clic sulla freccia nell’angolo
in alto a destra dell’oggetto.
Visual Studio visualizza le Attività di DataGridView, un elenco di proprietà comuni e comandi
relativi all’oggetto visualizzazione griglia dati. L’elenco Attività di DataGridView ha il seguente
aspetto:
Le impostazioni e i comandi di questo elenco possono essere utilizzati per modificare la
tabella associata all’oggetto visualizzazione griglia dati e per abilitare o disabilitare la modifica
all’interno della visualizzazione griglia. Per impostazione predefinita, l’utente dispone di
capacità limitate di modifica delle informazioni nella tabella, nonostante sia comunque
possibile controllare se tali modifiche debbano essere salvate nel database sottostante.
Puoi anche modificare le colonne visualizzate, ancorare la griglia al contenitore principale
(in questo caso il form), filtrare record tramite una query (istruzione SQL) e visualizzare
l’anteprima dei dati nella tabella.
2. Fai clic su Anteprima dati per aprire la finestra di dialogo Anteprima dati.
Questa finestra di dialogo viene visualizzata quando si desidera esaminare i dati contenuti
nella tabella prima di eseguire realmente il programma.
Capitolo 19
Presentazione dei dati mediante il controllo DataGridView
475
3. Fai clic sul pulsante Anteprima.
Visual Studio carica la tabella Faculty da Faculty2010DataSet, come mostrato nell’immagine
che segue.
Questi dati sono già stati utilizzati nel capitolo 18, ma ora è possibile vedere tutte le otto
colonne che sono state selezionate, tutte in una volta. Visualizzare tutte le colonne insieme
è interessante, ma potrebbe causare un sovraccarico di informazioni; dipende da te quante
informazioni visualizzare e come devono essere formattate. Infatti potrebbe non essere
possibile visualizzare tutte le otto colonne, come nel caso della figura. In Visual Studio è
semplice personalizzare l'output della visualizzazione griglia dati in modo che vengano
visualizzate le informazioni corrette.
4. Fai clic sul pulsante Chiudi per chiudere la finestra di dialogo Anteprima dati.
Ora rimuoverai le colonne ID e Faculty ID dalla visualizzazione griglia dati per vedere solo le
informazioni che una tipica funzionalità di "ricerca" visualizzerebbe. Ricorda che hai incluso solo
il campo ID, così che il dataset avrà una chiave primaria, utile quando i dati vengono riscritti nel
database originale.
476 Parte IV Programmazione di database e per il Web
Rimozione di colonne da un oggetto visualizzazione griglia dati
1. Apri nuovamente l’elenco Attività di DataGridView e fai clic sul comando Modifica colonne.
Viene visualizzata la seguente finestra di dialogo Modifica colonne:
La finestra di dialogo Modifica colonne permette di aggiungere o rimuovere le colonne
visualizzate nell’oggetto visualizzazione griglia dati. Come illustrato più avanti in questo
capitolo, questa finestra di dialogo può essere impiegata anche per modificare le proprietà
dell’oggetto FacultyDataGridView. Ora devi rimuovere le colonne ID e Faculty ID.
Nota Anche se le colonne ID e Faculty ID stanno per essere rimosse dall'oggetto visualizza-
zione griglia dati, esse non vengono in alcun modo modificate nel database Faculty2010.accdb
sottostante.
2. Fai clic sulla colonna ID nella finestra di dialogo Colonne selezionate, quindi fai clic sul
pulsante Elimina.
3. Fai clic sulla colonna Faculty ID, quindi fai clic sul pulsante Elimina.
Visual Studio rimuove entrambe le colonne dall’elenco.
4. Fai clic su OK per confermare le modifiche, quindi premi Esc per chiudere l'elenco Attività di
DataGridView.
L’oggetto FacultyDataGridView viene visualizzato nuovamente, ma senza le colonne ID e
Faculty ID. Fatto ciò, nel form è disponibile uno spazio maggiore per la visualizzazione delle
informazioni del database.
Capitolo 19
Presentazione dei dati mediante il controllo DataGridView
477
5. Ridimensiona l’oggetto FacultyDataGridView in modo da fargli occupare meno spazio.
Il form dovrebbe risultare simile al seguente:
6. Fai clic sul pulsante Salva tutto per salvare le modifiche.
Con queste operazioni, ha visualizzato l’anteprima e personalizzato la tabella mediante gli
strumenti del database. Ora puoi eseguire il programma per vedere l’aspetto della visualizzazione
griglia dati in fase di esecuzione. Di seguito viene anche illustrato come ordinare i record presenti
in un oggetto visualizzazione griglia dati.
Gestione di un oggetto visualizzazione griglia dati in fase di esecuzione
1. Fai clic sul pulsante Avvia debug.
Visual Studio esegue il progetto nell’IDE. La tabella Faculty del database viene visualizzata
all’interno dell’oggetto visualizzazione griglia dati esattamente come impostata. Il form
dovrebbe essere simile al seguente:
478 Parte IV Programmazione di database e per il Web
L’istruzione nella routine evento Form1_Load che ha popolato la visualizzazione griglia dati
con le informazioni della tabella Faculty dovrebbe avere il seguente aspetto:
Me.FacultyTableAdapter.Fill(Me.Faculty2010DataSet.Faculty)
Questa riga è stata aggiunta al programma da Visual Studio quando hai trascinato la tabella
Faculty nel form dalla finestra Origini dati.
Ogni riga della visualizzazione griglia dati rappresenta un record di dati provenienti dalla
tabella Faculty del database. Le barre di navigazione fornite consentono di vedere tutti i
record o le colonne che possono non apparire sullo schermo. Questa utile funzionalità è
fornita automaticamente con il controllo DataGridView.
2. Scorri l’elenco dei record fino a visualizzare le 20 righe presenti, ognuna delle quali
rappresenta i dati relativi a un impiegato in una facoltà universitaria.
3. Riduci le dimensioni della colonna First Name posizionando il cursore tra le intestazioni delle
colonne First Name e E-Mail Address e trascinando verso sinistra il bordo della colonna.
Quando posizioni il cursore tra le intestazioni di colonna, questo cambia assumendo l’aspetto
di un’icona di ridimensionamento. Le colonne possono essere ridimensionate in fase di
esecuzione poiché per impostazione predefinita la proprietà AllowUserToResizeColumns
dell’oggetto visualizzazione griglia dati è impostata su True. Se desideri impedire il
ridimensionamento, puoi impostare questa proprietà su False.
4. Ingrandisci la colonna E-Mail Address per visualizzare meglio l'indirizzo e-mail.
Quando un oggetto visualizzazione griglia dati viene riempito di informazioni, è possibile
anche sfruttare la funzione di ordinamento del controllo DataGridView.
5. Fai clic sull’intestazione della colonna Last Name.
La visualizzazione griglia dati viene ordinata per cognome dei membri della facoltà. Il form
dovrebbe risultare simile al seguente:
Quando vengono riordinati i record di un database, è necessario disporre di una colonna di
ordinamento, o chiave, stabilita facendo clic sull’intestazione della colonna in base alla quale
Capitolo 19
Presentazione dei dati mediante il controllo DataGridView
479
tale ordinamento deve essere effettuato. Il controllo DataGridView fornisce l’identificazione
visiva della chiave di ordinamento corrente, rappresentata da una piccola freccia nella
parte destra dell’intestazione di colonna. Se il tipo di ordinamento attuale mostra un
elenco alfabetico ascendente (da A a Z), la freccia risulta rivolta verso l’alto. Un nuovo clic
sull’intestazione di colonna inverte il tipo di ordinamento visualizzando un elenco alfabetico
discendente (da Z ad A). La freccia riflette ogni variazione, pertanto è possibile passare
ripetutamente da una direzione di ordinamento all’altra e viceversa.
6. Fai clic più volte sulla colonna Last Name per vedere come cambiare direzione di
ordinamento.
7. Fai clic sulle altre intestazioni di colonna, ad esempio Department e Faculty Type, per ordinare
il database in base a queste chiavi.
8. Una volta completate le prove delle funzionalità di scorrimento, ridimensionamento e
ordinamento del controllo DataGridView, chiudi il form per interrompere il programma.
Il programma viene chiuso e viene visualizzato di nuovo l’ambiente di sviluppo.
Formattazione delle celle di DataGridView
Per personalizzare l’aspetto di un dataset in un form, è possibile controllare impostazioni e
orientamento di numerose caratteristiche di DataGridView mediante l’impostazione delle
proprietà in fase di progetto. Ad esempio, è possibile modificare la larghezza predefinita delle
celle della visualizzazione griglia dati, aggiungere o rimuovere le intestazioni di colonna, cambiare
i colori dello sfondo della visualizzazione griglia dati o delle intestazioni e modificare il colore delle
linee della griglia. L’esercitazione che segue mostra come sfruttare queste utili proprietà.
Impostazione della proprietà di visualizzazione della griglia dati in fase di
progettazione
1. Visualizza il form, quindi fai clic sull’oggetto visualizzazione griglia dati (se non ancora
selezionato).
2. Nella finestra Proprietà, fai clic sulla proprietà Columns, quindi sul pulsante con i puntini di
sospensione (. . .) nella seconda colonna per aprire la finestra di dialogo Modifica colonne.
Questa finestra di dialogo è già stata usata precedentemente per eliminare le colonne ID e
Faculty ID dalla tabella Faculty. Inoltre, essa viene impiegata per impostare le proprietà delle
singole colonne. Ora modificherai la larghezza predefinita delle colonne First Name ed E-Mail
Address.
3. Seleziona la colonna First Name, quindi imposta la proprietà Width su 60.
Una larghezza pari a 60 (misurata in pixel) garantisce spazio sufficiente per i nomi della
colonna First Name.
4. Seleziona la colonna E-Mail Address, quindi imposta la proprietà Width su 140.
In questo modo sarà disponibile più spazio per gli indirizzi e-mail più lunghi.
480 Parte IV Programmazione di database e per il Web
5. Fai clic su OK per chiudere la finestra di dialogo Modifica colonne.
Fatto ciò, puoi passare a impostare le proprietà che controllano l’aspetto di tutte le colonne
della tabella.
Nota Per configurare le singole colonne è possibile servirsi della finestra di dialogo Modifica
colonne. Per modificare le proprietà valide per tutte le colonne di una tabella, è necessario modificare le proprietà dell’oggetto visualizzazione griglia dati nella finestra Proprietà.
6. Nella finestra Proprietà, imposta la proprietà ColumnHeadersVisible su False.
Nonostante i nomi delle colonne di questo database siano decisamente espliciti, in alcuni casi
non consentono di identificare chiaramente il contenuto delle colonne, oppure contengono
abbreviazioni o termini che è necessario nascondere agli utenti. L’impostazione di questa
proprietà rimuove i nomi di colonna dalla tabella.
7. Fai clic sulla proprietà AlternatingRowsDefaultCellStyle, quindi sul pulsante con i puntini di
sospensione.
La proprietà AlternatingRowsDefaultCellStyle controlla il colore usato per lo sfondo delle celle
in caso di utilizzo delle righe alternate. Modificando questa impostazione, è possibile ottenere
un effetto di alternanza tra le varie righe di una visualizzazione griglia dati, ad esempio
utilizzando il bianco e un altro colore a scelta. Solitamente questo effetto consente di rendere
più leggibili i record delle tabelle più lunghe.
Visual Studio visualizza la finestra di dialogo Generatore CellStyle, uno strumento impiegato
per impostare le proprietà delle celle di una colonna nelle tabelle di visualizzazione delle
griglie di dati.
8. Fai clic sulla proprietà BackColor, quindi sulla sua freccia, poi sulla scheda Personalizzato e
infine sul colore giallo chiaro.
La finestra di dialogo dovrebbe avere il seguente aspetto: Il colore giallo non è visibile nel
libro, ma lo puoi notare nella finestra di dialogo.
Capitolo 19
Presentazione dei dati mediante il controllo DataGridView
481
9. Fai clic su OK nella finestra di dialogo.
Al momento dell’esecuzione del programma, le righe della visualizzazione griglia dati saranno
visualizzate alternativamente di colore bianco e giallo.
Nota Il colore visualizzato attorno ai bordi delle celle è controllato dalla proprietà
BackgroundColor. Per modificare il colore di tutte le celle di una visualizzazione griglia
dati, è possibile servirsi della proprietà DefaultCellStyle. Per cambiare il colore di sfondo usato per le celle di intestazione (se visualizzate), è possibile modificare la proprietà
ColumnHeadersDefaultCellStyle.
10. Fai clic sulla proprietà GridColor, quindi sulla freccia nella seconda colonna, poi sulla scheda
Personalizzato e infine sul colore Navy (blu scuro).
Questa proprietà controlla il colore delle linee della griglia. Se modifichi il colore dello sfondo
delle celle, puoi voler modificare anche il colore delle linee della griglia.
Ora puoi eseguire il programma per vedere l’effetto delle modifiche apportate alla
formattazione.
11. Fai clic sul pulsante Avvia debug.
Dopo alcuni istanti, la griglia viene visualizzata con le informazioni presenti nella tabella
Faculty. Il form dovrebbe risultare simile alla figura seguente:
Nota che le intestazioni di colonna sono state rimosse, che la seconda colonna è leggermente
più stretta e che la terza è un po' più larga. Nota anche il motivo a righe alternate bianche e
gialle e le linee della griglia blu (non troppo distinguibili in questo manuale, ma presenti sullo
schermo).
12. Fai clic su Chiudi per arrestare il programma.
482 Parte IV Programmazione di database e per il Web
Ti consiglio di osservare la finestra Proprietà per esaminare le varie proprietà e personalizzazioni
disponibili. Infatti, le opzioni di formattazione presenti offrono numerose possibilità. Ricorda che
queste proprietà hanno effetto su tutte le colonne di una tabella, invece che su una sola.
Aggiunta di un secondo oggetto visualizzazione griglia
dati
Per fornire agli utenti un’interfaccia contenente molte visualizzazioni del database, è possibile
aggiungere al form un secondo oggetto visualizzazione griglia dati. Dopo avere stabilito un
dataset nella finestra Origini dati, è possibile aggiungere rapidamente un ulteriore controllo
DataGridView associato a una seconda tabella di tale dataset. Se connetti una seconda tabella di
database (invece che una seconda copia della prima tabella), puoi aggiungere anche una seconda
barra di navigazione al form e utilizzarla per controllare separatamente la seconda visualizzazione
griglia dati. Nel seguente esercizio aggiungerai una seconda versione della tabella Faculty al form
contenente un diverso set di campi con informazioni sulla facoltà.
Associazione di un secondo controllo DataGridView alla tabella Faculty
1. Espandi le dimensioni del form o riduci l'altezza dell'oggetto FacultyDataGridView in modo
da lasciare spazio sul form per un secondo oggetto visualizzazione griglia dati da posizionare
sotto il primo.
Dal momento che la risoluzione del mio schermo sarà probabilmente inferiore alla tua, io
riduco l'altezza dell'oggetto FacultyDataGridView e allargo un po' il form per posizionare la
seconda visualizzazione griglia dati.
2. Apri la finestra Origini dati (se non è già aperta).
3. Trascina la tabella Faculty dalla finestra Origini dati fino sotto all'oggetto
FacultyDataGridView.
Visual Studio crea un secondo oggetto visualizzazione griglia dati chiamato
FacultyDataGridView sul form. In questo caso stai aggiungendo una seconda copia della
tabella Faculty al programma. Tuttavia, se il database ha più tabelle, una cosa interessante da
fare è aggiungere una seconda tabella al form, che genererà una visualizzazione dei record
completamente diversa.
4. Fai clic con il tasto destro del mouse sul nuovo oggetto FacultyDataGridView, quindi fai clic
sul comando Modifica colonne.
Viene visualizzata la finestra di dialogo Modifica colonne.
5. Seleziona e rimuovi le colonne ID, E-mail Address, Department, Faculty Type, e Business
Phone.
Questa volta visualizzerai informazioni un po' diverse rispetto alla tabella Faculty. Al termine,
rimangono visualizzate le colonne Last Name, First Name e Faculty ID, come mostrato
nell’immagine che segue:
Capitolo 19
Presentazione dei dati mediante il controllo DataGridView
483
6. Fai clic su OK per chiudere la finestra di dialogo Modifica colonne.
7. Sposta e ridimensiona il secondo oggetto visualizzazione griglia dati sul form, in modo che
tutte e tre le righe vengano visualizzate e le visualizzazioni griglia dati siano una accanto
all'altra.
Il form dovrebbe avere un aspetto simile a quello mostrato di seguito. L’immagine è stata
creata su un sistema su cui Visual Studio opera con una risoluzione dello schermo di 800 x
600 pixel, pertanto è stato necessario nascondere molti strumenti per visualizzare interamente
il form.
484 Parte IV Programmazione di database e per il Web
Se vuoi eseguire ora il programma e i due controlli visualizzazione griglia dati sono collegati,
non devi aggiungere altri controlli al progetto. Con una barra di navigazione, le due tabelle
saranno collegate ed entrambe scorreranno automaticamente, anche se verranno visualizzati
campi leggermente diversi. Di seguito viene illustrato come tutto ciò funziona.
8. Fai clic sul pulsante Salva tutto per salvare le modifiche.
9. Fai clic sul pulsante Avvia debug nella barra degli strumenti.
Visual Studio esegue il programma DataGridView Sample nell’IDE. Vedrai due oggetti
visualizzazione griglia dati sul form, come mostrato nella seguente figura:
10. Utilizza la barra di navigazione per avviare lo scorrimento dei record della tabella Faculty.
Puoi notare che i due oggetti visualizzazione griglia dati sono collegati, perché condividono la
stessa tabella e lo stesso data adapter sottostante, oltre al navigatore. Questo è uno dei modi
in cui funziona la navigazione nel dataset in questa particolare implementazione; tuttavia, se
decidi di visualizzare due tabelle di database diverse, puoi aggiungere una seconda barra di
navigazione e spostarti tra i record in modo distinto.
11. Utilizza la barra di navigazione per spostarti nel contenuto dalla parte superiore dell'oggetto
visualizzazione griglia dati.
Le barre di navigazione consentono di visualizzare i due oggetti visualizzazione griglia dati in
modo indipendente, così non devi guardare sempre i record per lo stesso dipendente.
12. Una volta terminato di sperimentare il funzionamento degli oggetti visualizzazione griglia
dati, fai clic sul pulsante Chiudi per chiudere l’applicazione DataGridView Sample.
Probabilmente puoi apprezzare l'utilità degli oggetti visualizzazione griglia dati per gli utenti che
vogliono confrontare le informazioni di tabelle di grandi dimensioni. Sei i dati sono filtrati con
istruzioni SQL SELECT, l’applicazione può diventare rapidamente molto potente.
Capitolo 19
Presentazione dei dati mediante il controllo DataGridView
485
Aggiunta di un controllo BindingNavigator per creare una
seconda barra di navigazione sul form
Se decidi di aggiungere una seconda tabella di database al form, ricorda che puoi
aggiungere anche una seconda barra di navigazione, in modo che l'utente possa utilizzare
le due diverse barre contemporaneamente. Per fare ciò, devi utilizzare un database
contenente più di una tabella (nel database Faculty2010.accdb c'era solo una tabella, ma di
solito nei database ci sono più tabelle tra cui scegliere). Completa la seguente procedura
per aggiungere una seconda tabella e una barra di navigazione al programma.
1.
Utilizza la finestra Origini dati per creare un secondo oggetto visualizzazione griglia
dati sul form, che rappresenta una seconda tabella nel database.
2.
Personalizza i campi della tabella impostando le proprietà e utilizzando il comando
Modifica colonne.
3.
Fai doppio clic sul controllo BindingNavigator nella scheda Dati della Casella degli
strumenti. Visual Studio aggiunge BindingNavigator1 alla barra dei componenti, quindi
aggiunge una seconda barra di navigazione alla parte superiore del form. In alcuni casi,
può essere necessario spostare gli oggetti visualizzazione griglia dati leggermente verso il
basso qualora la nuova barra di navigazione vi si sovrapponga parzialmente.
4.
Modifica la proprietà BindingSource del secondo oggetto navigatore all'origine
di associazione della seconda tabella. Ciò viene semplificato dalla freccia BindingSource
della finestra Proprietà, che visualizza i nomi delle due origini di associazione valide
nel programma, così che tu possa semplicemente fare una scelta dall'elenco. Una volta
stabilito un collegamento tra la seconda barra di navigazione e l’oggetto che rappresenta
la seconda tabella, il programma è pronto per l’esecuzione.
Procedura aggiuntiva: aggiornamento del database
originale
Come già citato precedentemente, l’oggetto dataset utilizzato nel programma è solo una
rappresentazione dei dati presenti nel database originale. Ciò vale anche per le informazioni
memorizzate negli oggetti visualizzazione griglia dati del form: le modifiche effettuate dall’utente
in questi dati vengono salvate nel database originale solamente se la proprietà ReadOnly
dell’oggetto visualizzazione griglia dati è impostata su False e l’utente fa clic sul pulsante Salva dati
nella barra di navigazione. I progettisti di ADO.NET e Visual Studio hanno creato questa relazione
per proteggere il database originale e consentire agli utenti di manipolare liberamente i dati
visualizzati nei programmi, indipendentemente dalla possibilità di salvarli o meno.
L’esercitazione che segue esamina la proprietà ReadOnly del primo oggetto visualizzazione
griglia dati, la quale abilita o disabilita la possibilità di modificare le informazioni nell’oggetto
FacultyDataGridView. Inoltre, apprenderai l’utilizzo del pulsante Salva dati, il quale memorizza le
modifiche nelle tabelle del database originale su disco.
486 Parte IV Programmazione di database e per il Web
Abilitazione delle modifiche in un database
1. Fai clic sul primo oggetto visualizzazione griglia dati sul form (FacultyDataGridView).
2. Nella finestra Proprietà, scorri fino alla proprietà ReadOnly, poi analizza l'impostazione della
relativa proprietà.
Se la proprietà ReadOnly è impostata su False, l’utente è in grado di eseguire modifiche alle
informazioni nelle celle della visualizzazione griglia dati. Se desideri che gli utenti possano
modificare le informazioni e memorizzare tali modifiche nel database cui è connesso il
programma, è necessario mantenere questa impostazione predefinita. Al contrario, per
disabilitare la possibilità di eseguire modifiche è necessario impostare la proprietà ReadOnly
su True.
Nel caso in esame viene mantenuta l’impostazione predefinita False, poiché si desidera
verificare il funzionamento dell’aggiornamento del database Faculty2010.accdb sottostante.
Suggerimento Il programma di esempio DataGridView Sample completo è disponibile nella
cartella C:\Vb10sbs\Chap19\Datagridview sample.
3. Fai clic sul pulsante Avvia debug per verificare la proprietà ReadOnly della prima griglia.
I due oggetti visualizzazione griglia dati vengono visualizzati dalla tabella Faculty.
4. Nel primo oggetto visualizzazione griglia dati, nel record per il membro della facoltà Physics,
Wilson Pais, fai clic sulla cella contenente Lecturer (il campo Faculty Type), digita Assistant
Professor, quindi premi Invio.
Mentre esegui la modifica, una piccola icona a forma di matita appare nell’intestazione della
riga a sinistra, indicando che è in corso una variazione dei dati presenti. Lo schermo dovrebbe
essere simile a questo:
Capitolo 19
Presentazione dei dati mediante il controllo DataGridView
487
Quando premi Invio o fai clic su un’altra cella dell'oggetto visualizzazione griglia dati, la
modifica viene salvata nel dataset Faculty2010DataSet.
5. Fai clic sul pulsante Save data (il dischetto) nella barra di navigazione.
Visual Studio utilizza il metodo UpdateAll per memorizzare il dataset modificato nel database
sottostante. L’istruzione usata per eseguire l’operazione di salvataggio nella routine evento
FacultyBindingNavigatorSaveItem_Click è la seguente:
Me.TableAdapterManager.UpdateAll(Me.Faculty2010DataSet)
TableAdapterManager è il componente di Visual Studio 2010 che consente di controllare
una o più tabelle di database in un programma. Il metodo UpdateAll salva le modifiche
in tutte le tabelle aperte in un programma, ossia salva le modifiche non solo della tabella
Faculty, ma anche delle altre tabelle aperte. In questo caso non è obbligatorio accettare il
comportamento di salvataggio predefinito. Se desideri salvare solo le modifiche della tabella
Faculty quando l'utente fa clic sul pulsante Salva dati, sostituisci l'istruzione precedente con la
seguente riga di codice:
Me.FacultyTableAdapter.Update(Me.Faculty2010DataSet.Faculty)
Se utilizzi il metodo Update per un determinato table adapter, saranno salvati solo i dati a lui
associati. Ricorda inoltre che è anche possibile controllare le modifiche eseguite dall’utente
all’interno delle tabelle tramite la proprietà ReadOnly.
6. Fai clic sul pulsante Chiudi per terminare il programma.
Il programma si chiude e viene visualizzato nuovamente l’IDE di Visual Studio. A questo punto
puoi eseguire nuovamente il programma per verificare che la tabella Faculty del database
Faculty2010.accdb sia stata modificata. Al riavvio del programma, questo carica i dati dal
database.
7. Fai clic sul pulsante Avvia debug.
Dopo qualche istante, gli oggetti visualizzazione griglia dati vengono caricati con i relativi dati.
Noterai che la riga della tabella Faculty contenente il nome Wilson Pais è stata aggiornata con
la modifica Assistant Professor. Il programma funziona!
8. Fai clic sul pulsante Chiudi per terminare il programma.
Se desideri proseguire con le prove relative alla proprietà ReadOnly per uno o entrambi
gli oggetti visualizzazione griglia dati, imposta il valore di ReadOnly su True e verifica cosa
accade quando tenti di modificare il database (non sarà possibile fare o salvare modifiche).
Puoi anche provare ad aggiungere nuove righe di dati al database utilizzando le funzioni di
modifica incorporate e i pulsanti della barra degli strumenti associati ai controlli DataGridView e
BindingNavigator. Prima di aggiungere nuove righe, reimposta la proprietà ReadOnly su False.
Bene, fai tesoro dei risultati ottenuti. Hai appreso come visualizzare più tabelle e record tramite i
controlli DataGridView e BindingNavigator, come personalizzare la griglia con impostazioni delle
proprietà e come salvare nel database originale gli aggiornamenti eseguiti in una tabella. Come
si è visto, la programmazione dei database con ADO.NET e Visual Studio è un’operazione lineare
ma che può diventare complessa.
488 Parte IV Programmazione di database e per il Web
Vi sono molti strumenti, componenti e tecniche di programmazione legati alla visualizzazione, alla
manipolazione e all’aggiornamento dei record di un database, oltre ad altri argomenti importanti
non ancora discussi, quali la protezione e i problemi legati all’uso di database di grandi dimensioni
impiegati da molti utenti contemporaneamente.
Nonostante i risultati ottenuti finora abbiano richiesto pochissimo codice, vi sono ancora molte
cose da imparare se si desidera fare un uso approfondito dei database all’interno di applicazioni
Visual Basic. Per un elenco di letture consigliate su questi argomenti, consulta l’appendice.
Accesso ai dati in un ambiente Web Forms
Le tecniche di accesso ai dati discusse in questo capitolo e nel capitolo 18, sono progettate
per essere impiegate in Progettazione Windows Form, l’ambiente di Visual Studio
utilizzato per creare la maggior parte dei programmi discussi in questo manuale. Tuttavia,
nell’ambiente dei form per il Web è possibile utilizzare anche le tecniche di programmazione
di ADO.NET, le quali consentono di condividere i dati tramite Internet e applicazioni
incentrate sui dati accessibili tramite browser Web quali Windows Internet Explorer. Queste
tecniche sono illustrate verso la fine del prossimo capitolo, dove è possibile apprendere
come utilizzare alcuni nuovi strumenti tra cui il controllo GridView, una versione del controllo
DataGridView progettata per visualizzare le tabelle di un database nei siti Web.
Riferimenti rapidi del capitolo 19
Obiettivo
Azione
Definizione di una connessione con le tabelle di un database in un progetto
Utilizza la Configurazione guidata origine dati per collegare il progetto
a un database, crea un dataset e popola la finestra Origini dati con una
rappresentazione delle tabelle selezionate.
Creazione di un oggetto
visualizzazione griglia dati
in un form per visualizzare
un’intera tabella di un
database
Trascina l’icona della tabella dalla finestra Origini dati al form.
Fatto ciò, ridimensiona l’oggetto visualizzazione griglia dati in modo da
rendere visibili tutte le colonne presenti.
Visualizzazione dell’anteprima Fai clic sulla freccia dell’oggetto visualizzazione griglia dati per visualizzare
dei dati associati a un ogget- l’elenco Attività di DataGridView. Fai clic sul comando Anteprima dati,
to visualizzazione griglia dati quindi sul pulsante Anteprima nella finestra di dialogo Anteprima dati.
Rimozione di una colonna da
un oggetto visualizzazione
griglia dati
Fai clic sulla freccia dell’oggetto visualizzazione griglia dati per visualizzare
l’elenco Attività di DataGridView. Fai clic sul comando Modifica colonne,
quindi sulla colonna da rimuovere nella casella Colonne selezionate e infine sul pulsante Rimuovi.
Capitolo 19
Presentazione dei dati mediante il controllo DataGridView
489
Obiettivo
Azione
Ordinamento dei record
nell'oggetto visualizzazione
griglia dati in fase di esecuzione
Fai clic sull’intestazione della colonna in base alla quale desideri eseguire
l’ordinamento. Visual Studio esegue l'ordinamento alfabetico dell'oggetto
visualizzazione griglia dati in base a tale colonna.
Inversione della direzione di
ordinamento di una visualizzazione griglia dati in fase di
esecuzione
Fai nuovamente clic sull’intestazione della colonna per invertire l’ordinamento (da A–Z a Z–A).
Modifica della larghezza
predefinita di una colonna in
un oggetto visualizzazione
griglia dati
Nella finestra Proprietà, fai clic sulla proprietà Columns, quindi sul pulsante
con i puntini di sospensione. Nella finestra di dialogo Modifica colonne,
imposta il valore desiderato per la proprietà Width.
Come nascondere le intestazioni di colonna in un oggetto visualizzazione griglia dati
Imposta la proprietà ColumnHeadersVisible su False.
Creazione di uno schema di
colori alternati per le righe di
un oggetto visualizzazione
griglia dati
Scegli uno schema di colori da usare per le righe alternate mediante
la proprietà AlternatingRowsDefaultCellStyle. Nella finestra di dialogo
Generatore CellStyle, imposta un colore a piacimento nella proprietà
BackColor. Il colore selezionato verrà usato in alternanza con il bianco.
Modifica il colore delle righe
della griglia in un oggetto
visualizzazione griglia dati.
Imposta la proprietà GridColor.
Aggiunta di un secondo
oggetto visualizzazione griglia dati a un form
Trascina una seconda tabella dalla finestra Origini dati al form.
Può essere la stessa tabella utilizzata nel primo oggetto visualizzazione
griglia dati, oppure una seconda tabella all'interno del database.
Ridimensiona e personalizza la tabella, facendo attenzione a rendere
il form abbastanza largo da visualizzare tutte le colonne e i record
del database che devono essere visibili sullo schermo. Per aggiungere
una seconda barra di navigazione al form e consentire l’accesso alla
tabella, crea un secondo controllo BindingNavigator nel form e imposta
la proprietà BindingSource in modo da connetterla all’origine che
rappresenta la nuova tabella appena creata.
Come impedire che gli utenti
possano modificare i dati
visualizzati in un oggetto
visualizzazione griglia dati
Imposta la proprietà ReadOnly dell'oggetto visualizzazione griglia dati su
True.
Scrittura delle modifiche fatte
nell'oggetto visualizzazione
griglia dati nel database
sottostante
Verifica che la proprietà ReadOnly dell’oggetto visualizzazione griglia dati
sia impostata su False. Fatto ciò, durante la fase di esecuzione utilizza il
pulsante Salva dati nella barra di navigazione per memorizzare le modifiche e aggiornare il database. In alternativa, puoi utilizzare nel codice i
metodi Update o Me.TableAdapterManager.UpdateAll.
Capitolo 20
Creazione di siti e pagine Web con
Visual Web Developer e ASP.NET
Al termine di questo capitolo sarai in grado di:
■
Avviare Visual Web Developer e creare un nuovo sito Web.
■
Utilizzare gli strumenti le finestre di Visual Web Developer, compreso Web Page Designer.
■
Utilizzare la Casella degli strumenti di Visual Web Developer per aggiungere i controlli server
alle pagine Web.
■
Aggiungere testo, effetti di formattazione e codice Visual Basic a una pagina Web che calcola
le rate di un prestito per l’acquisto di un’automobile.
■
Creare una pagina Web che visualizza una Guida.
■
Utilizzare il controllo HyperLink per collegare una pagina Web a un’altra in un sito Web.
■
Utilizzare il controllo GridView per visualizzare informazioni estratte da un database in una
pagina Web.
■
Impostare Title in una pagina Web e modificare la pagina master.
In questo capitolo, apprenderai come creare siti e pagine Web utilizzando lo strumento Visual Web
Developer, incluso in Microsoft Visual Studio 2010. Esso ha lo stesso aspetto dell'IDE (Integrated
Development Environment) di Visual Studio, ma è personalizzato per la programmazione Web
e per Microsoft ASP.NET 4, il componente .NET Framework di Microsoft progettato per fornire
le funzionalità Internet più recenti. Nonostante in questo contesto non sia possibile fornire una
descrizione completa della programmazione Web e di ASP.NET, tra la programmazione Web e la
programmazione Windows vi sono molti punti in comune che consentono di fare alcune utili prove
anche a chi ha poca esperienza nell’uso del codice HTML (Hypertext Markup Language), o non
lo conosce affatto. Ti consiglio, pertanto, di dedicare alcune ore a questo capitolo per verificare
la rapidità con cui è possibile creare un sito Web che calcola le rate di un prestito per l’acquisto
di un’automobile, creare una pagina Web contenente testo informativo e visualizzare dati da un
database Microsoft Access utilizzando il controllo GridView.
Parliamo di ASP.NET
ASP.NET 4, la piattaforma di sviluppo Web fornita d Microsoft, è stata migliorata in questo rilascio.
Alcuni miglioramenti includono: il metodo per creare le pagine in Web Page Designer; migliorie
della funzionalità relativa alle pagine Web ASP.NET e ad ASP.NET MVC, supporto per i browser
recenti e i dispositivi portatili, un nuovo controllo server Chart di ASP.NET, evoluzione dei controlli
FormView, ListView e QueryExtender; nuovi controlli dati dinamici e relativi sviluppi, miglioramenti del
491
492 Parte IV Programmazione di database e per il Web
modello di programmazione AJAX (Asynchronous JavaScript) e XML. Nonostante presenti alcune
somiglianze con una vecchia tecnologia di programmazione per il Web chiamata ASP (Active
Server Pages), ASP.NET è stato notevolmente migliorato dopo il suo rilascio con Visual Studio .NET
2002, e continua a evolversi con l’aggiunta di nuove funzioni a .NET Framework e a Visual Studio.
Visual Web Developer è lo strumento usato per creare e gestire le interfacce utente di ASP.NET,
comunemente chiamate pagine Web o siti Web.
Suggerimento Nei libri di programmazione che trattano ASP.NET, potrai notare che a volte le
pagine Web sono definite Web form e i siti Web applicazioni Web o applicazioni ASP.NET.
Utilizzando Visual Web Developer, è possibile creare un sito Web in grado di visualizzare
un’interfaccia utente, elaborare dati e fornire molti dei comandi e delle funzioni disponibili in ogni
applicazione Windows standard. Tuttavia, il sito Web creato viene visualizzato in un browser Web,
come Internet Explorer, Mozilla Firefox, Apple Safari, o in uno dei nuovi tipi di dispositivi mobili,
inclusi Google Chrome, BlackBerry Research in Motion e iPhone di Apple. Normalmente, questi
siti Web girano su uno o più server Web, che utilizzano Microsoft Internet Information Services
(IIS) per visualizzare le pagine Web e per gestire la maggior parte delle attività di elaborazione
richieste dal sito Web. In Visual Studio 2010, i siti Web girare su un computer locale senza
IIS, offrendo così maggiori possibilità di sviluppo e distribuzione. Questa strategia distribuita
consente di far funzionare i tuoi siti Web su un gran numero di computer, stand-alone o meno,
praticamente ovunque si trovino gli utenti e le loro origini dati.
Per creare un sito Web in Visual Studio 2010, è sufficiente fare clic sul comando Nuovo sito Web
nel menu File, quindi utilizzare Visual Web Developer per sviluppare una o più pagine Web che lo
compongono. Ogni pagina Web è formata da due parti:
■
Una pagina Web Form contenente il codice HTML e ASP.NET e i controlli necessari per
creare l’interfaccia utente.
■
Il file con il codice, cioè un modulo di codice su cui si basa la pagina Web Form.
Questa divisione è concettualmente molto simile ai Windows Form di cui si è discusso in Visual
Basic, con un componente interfaccia utente e un componente di codice. Il codice di questi
componenti può essere memorizzato in un singolo file .aspx, anche se solitamente il codice della
pagina Web Form si trova in un file .aspx, mentre il file del codice di base è ubicato in un file .aspx.
vb.
Oltre alle pagine Web, i siti Web possono contenere moduli di codice (file .vb), pagine HTML (file
.htm), informazioni di configurazione (file Web.config), informazioni su applicazioni Web globali
(file Global.asax), informazioni CSS (Cascading Style Sheet), file di script (JavaScript), pagine
master e altri componenti. Web Page Designer ed Esplora soluzioni possono essere impiegati per
spostarsi tra questi componenti in modo rapido ed efficiente.
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
493
Confronto tra pagine Web e Windows Form
Quali sono le differenze più importanti tra pagine Web e Windows Form? Per iniziare, le pagine
Web offrono un paradigma di programmazione leggermente differente dai Windows Form.
Mentre i Windows Form fanno uso di una finestra di applicazione Windows come interfaccia
utente principale del programma, i siti Web presentano le informazioni all’utente attraverso
una o più pagine Web con il supporto di codice di programmazione. Queste pagine vengono
visualizzate tramite un browser Web, ed è possibile crearle utilizzando Web Page Designer.
Come per i Windows Form, ogni pagina Web può comprendere testo, immagini, pulsanti,
caselle di riepilogo e altri oggetti impiegati per fornire informazioni, elaborare i dati immessi o
visualizzare i dati inviati. Tuttavia, il gruppo base dei controlli usati per creare una pagina Web non
è quello presente nella scheda Controlli comuni della Casella degli strumenti. I siti Web ASP.NET
devono invece utilizzare i controlli di una delle schede della Casella degli strumenti di Visual Web
Developer, tra cui Standard, Dati, HTML e molte altre. Ciascun controllo di Visual Web Developer
dispone di metodi, proprietà ed eventi univoci, e nonostante vi siano molte similitudini tra questi
controlli e quelli dei Windows Form, vi sono anche numerose differenze importanti. Ad esempio, il
controllo DataGridView di Visual Studio è chiamato GridView in Visual Web Developer e presenta
proprietà e metodi differenti.
Molti controlli delle pagine Web sono controlli server, cioè vengono eseguiti su un server Web.
I controlli server sono distinguibili per il prefisso “asp” nell’etichetta. I controlli HTML ubicati nella
scheda HTML della Casella degli strumenti di Visual Web Developer, sono per impostazione
predefinita controlli client, vengono cioè eseguiti solamente all’interno del browser dell’utente.
Tuttavia, per ora è necessario sapere soltanto che nei propri progetti di siti Web è possibile
utilizzare controlli server, controlli HTML o una combinazione dei due tipi. Con l’aumentare
della propria esperienza nella programmazione per il Web, è possibile addentrarsi nella
programmazione AJAX in Visual Studio, una tecnica in grado di aumentare l’efficienza delle
applicazioni Web e di aggiungere elementi complessi all’interfaccia utente.
Controlli server
I controlli server sono più potenti dei controlli HTML e operano in modi spesso molto simili ai
controlli dei Windows Form. In realtà, molti dei controlli server hanno gli stessi nomi dei controlli
dei Windows Form e offrono molte delle loro proprietà, metodi ed eventi. Oltre ai controlli
semplici quali Button, TextBox e Label, ve ne sono di più complessi quali Chart, FileUpload,
LoginView e RequiredFieldValidator forniti in numerose schede della Casella degli strumenti; nota
che Visual Studio 2010 ha aggiunto un gran numero di controlli a questo elenco. L’immagine che
segue mostra la maggior parte dei controlli server presenti nella Casella degli strumenti di Visual
Web Developer. (I controlli Dynamic Data e Rapporto non sono visualizzati.)
494 Parte IV Programmazione di database e per il Web
Controlli HTML
I controlli HTML sono un gruppo di vecchi controlli dell’interfaccia utente supportati da tutti i
browser Web e strettamente conformi ai primi standard HTML sviluppati per gestire gli elementi
dell’interfaccia utente di una pagina Web tipica. Essi comprendono Button, Text e Checkbox, utili
controlli base per la gestione di informazioni in una pagina Web rappresentabile interamente
mediante codice HTML. Se hai già utilizzato il linguaggio HTML, dovresti riconoscere questi
controlli. Tuttavia, anche se sono semplici da utilizzare e offrono il vantaggio di essere un "comune
denominatore" dei browser Web, hanno un limite, ovvero il fatto non poter mantenere il proprio
stato. In altre parole, i dati contenuti in questi controlli vengono persi tra le visualizzazioni della
pagina Web. L’immagine che segue mostra i controlli HTML disponibili nella scheda HTML della
Casella degli strumenti di Visual Web Developer:
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
495
Creazione di un sito Web con Visual Web Developer
Il modo migliore per conoscere Visual Web Developer e ASP.NET è di sperimentarne l’uso
praticamente. Le esercitazioni di questo capitolo illustrano come creare un semplice calcolatore
delle rate per l’acquisto di un’automobile che determina gli importi mensili e fornisce una
scheda che illustra il funzionamento del programma. Più avanti nel capitolo viene utilizzato
il controllo GridView per visualizzare una tabella di dati in una pagina Web dello stesso sito
Web. La procedura inizia verificando che Visual Studio sia configurato correttamente per la
programmazione in ASP.NET, quindi si precede a creare un nuovo progetto di sito Web. Fatto
ciò, Web Page Designer viene impiegato per creare una pagina Web con testo e collegamenti,
utilizzando i controlli della Casella degli strumenti di Visual Web Developer per aggiungere
controlli alla pagina Web.
Analisi dei requisiti software per la programmazione in ASP.
NET
Prima di poter creare il primo sito Web ASP.NET, è necessario assicurarsi che il computer sia
configurato correttamente. Per programmare in ASP.NET, è necessario avere installato Visual
Web Developer. Questo strumento è un componente di Visual Studio 2010 Professional,
Premium o delle versioni più avanzate. Puoi anche scaricare Visual Web Developer 2010 Express
dal sito http://www.microsoft.com/express/Web/ (informazioni in lingua inglese) perché esso
fornisce quasi tutte le funzionalità descritte nel capitolo (di seguito verranno segnalate tutte le
eventuali differenze). Se utilizzi Visual Web Developer 2010 Express, accertati di aver configurato
le impostazioni utente esperto. Questa operazione garantisce che i vari passaggi eseguiti nel
capitolo trovino maggiore corrispondenza con il software installato.
Visual Studio 2010 e Visual Web Developer comprendono un proprio server Web locale, pertanto
non è necessario procedere alla configurazione di un server Web con IIS (Internet Information
Services) e .NET Framework. Disporre di una server Web locale semplifica la creazione e il test
dei propri siti Web ASP.NET, operazioni che vedrai descritta in seguito come lo sarà il Server di
sviluppo ASP.NET.
In Visual Studio 2010, è possibile creare ed eseguire il proprio sito Web in uno dei tre percorsi
seguenti:
■
nel computer (tramite Server di sviluppo ASP.NET)
■
in un server HTTP con IIS e i relativi componenti
■
In un sito FTP (file server remoto)
Il primo percorso è quello usato in questo manuale, poiché non richiede hardware o software
aggiuntivi. Inoltre, durante lo sviluppo di un sito Web nel file system locale, tutti i file vengono
memorizzati in un’unica posizione. Al termine delle prove di funzionamento dell’applicazione, è
possibile distribuire i file su un server Web a scelta.
496 Parte IV Programmazione di database e per il Web
Creazione di un nuovo sito Web
1. Avvia Visual Studio e fai clic sul comando Nuovo sito Web nel menu File.
Nota Se il comando Nuovo sito Web non appare nel menu File, vuol dire che Visual Web
Developer non è stato installato. Per scaricare Vsual Web Developer Express, visitare
http://www.microsoft.com/express/Web/ (informazioni in lingua inglese) e seguire le istruzioni
di installazione.
Anche se hai visto il comando Nuovo sito Web in precedenza, questo non è ancora stato
utilizzato per gli scopi di questo manuale. Questo comando avvia Visual Web Developer
e prepara Visual Studio per la creazione di un sito Web. Viene visualizzata una finestra di
dialogo Nuovo sito Web simile a quella mostrata nell’immagine che segue:
In questa finestra di dialogo è possibile selezionare il modello di sito Web o applicazione,
l’ubicazione del sito Web (file system locale, server HTTP o sito FTP) e il linguaggio di
programmazione che si desidera usare (Visual Basic o Visual C#). È possibile anche identificare
la versione di .NET Framework da usare come destinazione dell’applicazione Web. (La
versione 4 offre il massimo numero di funzioni, ma in alcuni casi può essere necessario
progettare appositamente siti per piattaforme dotate di versioni precedenti di .NET
Framework. Tuttavia, Visual Web Developer 2010 Express non fornisce l'opzione per fare
riferimento a una versione specifica di .NET Framework.)
2. Nella finestra di dialogo Nuovo sito Web, verifica che siano selezionati il modello Sito Web
ASP.NET e Visual Basic.
3. Nell'elenco Percorso Web, accertati che sia selezionato File system.
4. Digita C:\Vb10sbs\MyChap20 nella casella di testo del nome file.
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
497
Nonostante nei precedenti esercizi il percorso della cartella di salvataggio sia sempre stato
specificato dopo aver creato il progetto, in Visual Web Developer si fa subito. Il prefisso “my”
nel nome del percorso consente di evitare eventuali conflitti con il sito Web fornito con i file di
esempio (C:\Vb10sbs\Chap20).
5. Fai clic su OK per confermare la selezione.
Visual Studio carica Visual Web Developer e crea una pagina Web (Default.aspx) in cui è
possibile inserire l’interfaccia utente e il file base del codice (Default.aspx.vb) in cui sarà
memorizzato il codice della pagina Web.
6. Qualora Default.aspx non sia visibile, fai doppio clic su Default.aspx in Esplora soluzioni.
7. Nella parte inferiore di Web Page Designer, fai clic sulla scheda Progettazione.
Fatto ciò, lo schermo dovrebbe avere l’aspetto mostrato nell’immagine che segue.
A differenza di Progettazione Windows Form, Web Page Designer mostra la pagina Web
in tre possibili visualizzazioni nell’IDE, con le tre schede presenti nella parte inferiore della
finestra (Progettazione, Dividi e Origine) che consentono di modificare la visualizzazione della
pagina Web.
La scheda Progettazione mostra approssimativamente l’aspetto che la pagina Web assume
quando viene aperta in un browser Web. Quando viene selezionata la scheda Progettazione,
nella finestra compare una pagina vuota (“APPLICAZIONE ASP.NET PERSONALE") con il
risultato della formattazione del codice sorgente in cui è possibile aggiungere i controlli
necessari nella pagina Web e definire come devono essere disposti i vari oggetti presenti al
suo interno.
498 Parte IV Programmazione di database e per il Web
Nella scheda Origine è possibile visualizzare e modificare il codice HTML e ASP.NET impiegato
per visualizzare la pagina Web in un browser Web. Se hai già utilizzato Microsoft Expression
Web, dovresti avere già familiarità con questi due modi di visualizzare una pagina Web, e
forse anche con alcuni dei tag HTML che controllano il modo in cui le pagine Web vengono
realmente mostrate. La scheda Dividi offre una visualizzazione combinata delle schede
Origine e Progettazione.
A questo punto, è utile sottolineare alcune altre differenze tra Windows Forms Designer
e Web Page Designer. La Casella degli strumenti ora contiene alcuni insiemi di controlli
impiegati esclusivamente per la programmazione Web. Esplora soluzioni contiene anche un
differente elenco di file di progetto per il sito Web in fase di creazione. In particolare, nota
il file Default.aspx in Esplora soluzioni, il quale contiene il codice dell’interfaccia utente per
la pagina Web attiva. Nidificato nel file Dafult.aspx, troverai il file Default.aspx.vb, un file di
configurazione chiamato Web.config e un file di pagina master chiamato Site.master.
Nota Quando chiudi il nuovo sito Web e arresti Visual Web Developer, osserva che è possibile aprire
nuovamente il sito facendo clic sul menu File di Visual Studio e poi sul comando Apri, Sito Web. Non
puoi aprire i siti Web utilizzando il comando Apri, Progetto nel menu File.
Ora sei pronto ad aggiungere il testo alla pagina Web utilizzando Web Page Designer.
Utilizzo di Web Page Designer
A differenza dei Windows Form, le pagine Web non possono contenere testo aggiunto
direttamente mentre la pagina è aperta in Web Page Designer. Nella visualizzazione Origine, il
testo appare racchiuso in tag HTML e ASP.NET in modo simile a quanto avviene nell’editor di
codice di Visual Studio. Nella visualizzazione Progettazione, il testo appare disposto in una griglia
dall’alto verso il basso, come accade negli elaboratori di testo come Microsoft Word, mentre non è
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
499
visibile alcun codice HTML. Negli eserci seguenti, dovrai immettere il testo nella visualizzazione
Progettazione, modificarlo e quindi eseguire alcune modifiche alla formattazione mediante i
pulsanti della barra degli strumenti di formattazione. Solitamente, la manipolazione del testo in
questo modo risulta più rapida rispetto all’aggiunta di un controllo Label in cui inserire il testo
nella pagina Web. Proviamo a immettere il testo.
Aggiunta di testo nella visualizzazione Progettazione
1. Fai clic sulla scheda Progettazione (se non è già selezionata) per visualizzare Web Page
Designer nella visualizzazione Progettazione.
All'inizio della pagina, viene visualizzato un rettangolo, vicino al testo "ASP.NET". Il testo del
modello indica come apparirà il testo in un Web form e quali sono i punti in cui è possibile
recuperare informazioni aggiuntive su ASP.NET. Osserva anche che la pagina Web presenta le
schede Home page e Informazioni su, fornite nella pagina predefinita.
2. Posiziona il mouse alla fine del testo "ASP.NET".
Alla fine della riga appare il cursore lampeggiante a forma di I.
3. Premi il tasto BACKSPACE per rimuovere il testo "ASP.NET" e digita Car Loan Calculator.
Visual Studio visualizza il titolo della pagina Web esattamente come dovrà apparire
all’apertura del sito Web nel browser.
4. Elimina la riga che inizia con "Per ulteriori informazioni su ASP.NET. . ." e sostituiscilo con la
frase seguente:
Enter the required information and click Calculate!
5. Elimina la frase del modello che inizia con "È inoltre disponibile documentazione. . .”
A questo punto, devi utilizzare la barra degli strumenti di formattazione per formattare il
titolo in corsivo e con un colore diverso.
6. Fai clic con il tasto destro del mouse sulla barra degli strumenti standard in Visual Web
Developer, per visualizzare l’elenco delle barre degli strumenti disponibili nell’IDE.
7. Se accanto a Formattazione nell’elenco non compare un segno di spunta, fai clic su
Formattazione per aggiungere la barra degli strumenti di formattazione.
La barra Formattazione viene visualizzata nell'IDE. Nota che essa contiene alcune funzioni
solitamente non disponibili nella barra degli strumenti di formattazione per il testo.
8. Seleziona il testo “Car Loan Calculator”.
In Visual Web Developer, prima di poter formattare il testo è necessario selezionarlo.
9. Fai clic sul pulsante Corsivo nella barra Formattazione.
10. Nel menu Formato, fai clic sul comando Tipo di carattere, seleziona Rosso nella casella di
riepilogo Colore e fai clic su OK.
Lo schermo sarà simile al seguente:
500 Parte IV Programmazione di database e per il Web
Ora puoi esaminare il codice HTML relativo al testo e alla formattazione specificati.
Visualizzazione del codice HTML e ASP.NET della pagina Web
1. Fai clic sulla scheda Origine nella parte inferiore della finestra Progettazione.
La scheda Origine mostra il codice HTML e ASP.NET relativo alla pagina Web. Per ottenere
maggiori informazioni sul codice, puoi ridimensionare temporaneamente alcuni strumenti
di programmazione utilizzando le barre di scorrimento. Il codice dovrebbe risultare simile
a quello illustrato nella figura seguente: Ricorda che il tuo codice può presentare alcune
differenze.
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
501
Una pagina Web è costituita da informazioni sulla pagina, script, informazioni CSS (Cascading
Style Sheet), tag HTML e ASP.NET, riferimenti alle immagini, oggetti e testo. La direttiva @
Page contiene informazioni sulla lingua selezionata durante la creazione dell’applicazione
Web, il nome di eventuali file base del codice e form ereditati.
I tag HTML e ASP.NET solitamente compaiono a coppie, in modo da consentire di vedere
chiaramente dove inizia e finisce una sezione. Ad esempio, il tag <style> identifica l’inizio del
documento, mentre il successivo tag </style> ne indica la fine. Osserva che il testo “Car Loan
Calculator” viene visualizzato all'interno dei tag <em></em> per applicare il corsivo. Sotto al
testo “Car Loan Calculator”, viene visualizzata la seconda riga di testo immessa.
Suggerimento Ricorda che la scheda Origine è un vero ambiente di modifica, pertanto è
possibile utilizzare per cambiare il testo immesso mediante le normali tecniche di modifica del
testo. Se hai familiarità con il codice HTML ed ASP.NET, puoi aggiungere ulteriori tag e contenuto.
2. Fai clic sulla scheda Progettazione per tornare a visualizzare la pagina Web nella
visualizzazione Progettazione, quindi apri la Casella degli strumenti (se non ancora visibile).
Aggiunta di controlli server a un sito Web
A questo punto è possibile procedere all’aggiunta di controlli TextBox, Label e Button al calcolatore
delle rate per l’acquisto dell’automobile. Questi controlli, disponibili nella Casella degli strumenti di
Visual Web Developer, sono molto simili ai controlli dei Windows Form che hanno lo stesso nome
e utilizzati in altri punti di questo manuale. Le loro differenze più importanti saranno discusse
a breve. La cosa più importante da ricordare è che in Web Page Designer i controlli vengono
aggiunti nel punto di inserimento facendo doppio clic sul loro nome nella Casella degli strumenti.
Dopo avere aggiunto i controlli alla pagina Web, è possibile procedere a impostarne le proprietà.
Utilizzo dei controlli TextBox,
x Label e Button
1. Visualizza la scheda Standard della Casella degli strumenti (se non è già visibile).
2. Posiziona il punto di inserimento alla fine della seconda riga di testo della pagina Web, quindi
premi il tasto Invio per creare un piccolo spazio per i controlli sotto il testo.
Dato che i controlli vengono posizionati nel punto di inserimento corrente, prima di
fare doppio clic su un controllo nella Casella degli strumenti è necessario posizionare
correttamente il puntatore.
Nota Per impostazione predefinita, Web Page Designer posiziona i controlli in modo relativo
ad altri controlli. Questa è una differenza importante tra Web Page Designer e Progettazione
Windows Form. Infatti, Progettazione Windows Form consente di posizionare i controlli ovunque si desideri all’interno del form. Web Page Designer può essere impostato in modo da
permettere il libero posizionamento dei controlli nella pagina Web (modalità chiamata posizionamento assoluto); tuttavia, ciò può causare comportamenti differenti a seconda del browser
Web usato per visualizzare la pagina.
502 Parte IV Programmazione di database e per il Web
3. Fai doppio clic sul controllo TextBox nella scheda Standard della Casella degli strumenti per
creare un oggetto casella di testo nel punto di inserimento nella pagina Web.
Nota il testo asp:textbox#TextBox1 che appare sopra l’oggetto casella di testo. Il prefisso "asp"
indica che questo oggetto è un controllo server ASP.NET. (Il testo non viene più visualizzato
quando si esegue il programma.)
4. Fai clic sul lato destro dell’oggetto casella di testo per posizionare il punto di inserimento sul
suo bordo esterno, quindi premi Invio.
5. Fai doppio clic di nuovo sul controllo TextBox per aggiungere un secondo oggetto casella di
testo alla pagina Web.
6. Ripeti i punti 4 e 5 per creare un terzo oggetto casella di testo sotto la seconda casella di testo.
Ora puoi utilizzare il controllo Label per inserire le etichette che indicano lo scopo delle
caselle di testo.
7. Fai clic a destra del primo oggetto casella di testo per spostare il punto di inserimento oltre il
suo bordo destro.
8. Premi due volte la barra spaziatrice per aggiungere due spazi, quindi fai doppio clic sul controllo
Label nella Casella degli strumenti per aggiungere un oggetto etichetta alla pagina Web.
9. Ripeti i punti 7 e 8 per aggiungere altri due oggetti etichetta a destra della seconda e della
terza casella di testo.
10. Fai clic a destra del terzo oggetto etichetta per posizionare il punto di inserimento a destra
dell’etichetta, quindi premi Invio.
11. Fai doppio clic sul controllo Button per creare un oggetto pulsante nella parte inferiore della
pagina Web.
Come i controlli TextBox e Label, anche il controllo Button è molto simile alla controparte
Windows Form. Lo schermo sarà simile al seguente:
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
503
Ora puoi procedere a impostare le proprietà dei sette nuovi controlli creati nella pagina Web.
Se non è già visibile, apri la finestra Proprietà premendo F4. Durante l’impostazione delle
proprietà, potrai notare una importante differenza tra pagine Web e Windows Form, poiché
in Visual Web Developer il nome della familiare proprietà Name è stato modificato in ID.
Nonostante la differenza nel nome, le due proprietà eseguono la medesima funzione.
12. Imposta come segue le proprietà degli oggetti presenti nel form:
Oggetto
Proprietà
Impostazione
TextBox1
ID
txtAmount
TextBox2
ID
txtInterest
TextBox3
ID
txtPayment
Label1
ID
lblAmount
Text
“Loan Amount”
ID
lblInterest
Text
“Interest Rate (for example, 0.09)”
ID
lblPayment
Text
“Monthly Payment”
ID
btnCalculate
Text
“Calculate”
Label2
Label3
Button1
La pagina Web dovrebbe avere il seguente aspetto:
504 Parte IV Programmazione di database e per il Web
Creazione di routine evento per i controlli delle pagine Web
Per creare routine evento predefinite (o gestori evento) per i controlli in una pagina Web, è
possibile fare doppio clic sugli oggetti presenti nella pagina e digitare il codice necessario
nell’editor di codice. Nonostante l’utente possa vedere i controlli presenti nella pagina Web nel
proprio browser Web, il codice realmente eseguito è ubicato sul computer di prova locale o su un
server Web, a seconda della configurazione usata per lo sviluppo del progetto e da come questo
dovrà essere distribuito. Ad esempio, quando un utente fa clic su un pulsante in una pagina Web
ospitata su un server Web, il browser reinvia l’evento clic del pulsante al server, il quale elabora
tale evento e invia una nuova pagina Web al browser. Benché il processo possa assomigliare a
quello dei Windows Form, in realtà vi sono molte operazioni eseguite dietro lo scene ogni volta
che un controllo viene impiegato in una pagina Web di ASP.NET.
L’esercitazione che segue mostra come creare la routine evento predefinita nella pagina Web per
l’oggetto btnCalculate.
Creazione della routine evento btnCalculate_Click
1. Fai doppio clic sul pulsante Calculate nella pagina Web.
Il file base del codice (Default.aspx.vb) viene aperto nell’editor di codice, visualizzando la
routine evento btnCalculate_Click.
2. Immetti il seguente codice:
Dim LoanPayment As Double
‘Utilizza la funzione Pmt per determinare la rata per un prestito di 36 mesi
LoanPayment = Pmt(CDbl(txtInterest.Text) / 12, 36, CDbl(txtAmount.Text))
txtPayment.Text = Format(Abs(LoanPayment), “$0.00”)
Questa routine evento utilizza la funzione finanziaria Pmt di Visual Basic per stabilire
l’importo della rata relativa a un prestito per l’acquisto di un’automobile utilizzando il tasso di
interesse specificato (txtInterest.Text), un periodo di rimborso di tre anni (36 mesi) e l’importo
specificato (txtAmount.Text). Il risultato viene memorizzato nella variabile a precisione doppia
LoanPayment, quindi viene formattato con la notazione di valuta appropriata e visualizzato
nella pagina Web mediante l’oggetto casella di testo txtPayment.
Le due proprietà Text vengono convertite dal formato stringa al formato a doppia precisione
mediante la funzione CDbl. La funzione Abs (valore assoluto) viene impiegata per trasformare
l’importo del pagamento in un valore intero positivo. (Attualmente, Abs appare nell’editor
di codice con una sottolineatura irregolare poiché si basa sulla classe System.Math che
sarà specificata nella prossima operazione.) Perché è necessario trasformare l’importo del
pagamento in un numero positivo? Per impostazione predefinita, la funzione Pmt restituisce
valori negativi indicanti gli importi dovuti, ma solitamente i valori negativi hanno un aspetto
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
505
strano quando non appartengono a un foglio di bilancio, pertanto si è deciso di trasformarli
in positivi.
Nota che le istruzioni contenute nel file del codice sono semplici righe di codice in Visual
Basic, lo stesso cioè utilizzato nel resto del manuale. In generale, il processo sembra simile alla
creazione di un’applicazione Windows.
3. Spostati all’inizio dell’editor di codice e immetti la seguente istruzione come prima riga del
file:
Imports System.Math
Come già discusso nel capitolo 5, per impostazione predefinita la funzione Abs non è
compresa in Visual Basic, ma è disponibile all’interno della classe System.Math di .NET
Framework e può essere facilmente sfruttata nel progetto mediante l’istruzione Imports. La
applicazioni Web possono impiegare le librerie di classi di .NET Framework esattamente come
fanno le applicazioni Windows.
L’aspetto dell’editor di codice sarà simile al seguente:
4. Fai clic sul pulsante Salva tutto nella barra degli strumenti Standard.
Ecco fatto. Hai così immesso il codice necessario per eseguire il calcolo delle rate del prestito
e rendere interattiva la pagina Web. Ora puoi procedere a creare ed eseguire il progetto per
vedere come funziona. Di seguito potrai anche apprendere altre informazioni sulle impostazioni
di protezione all’interno di Internet Explorer, un argomento strettamente legato allo sviluppo di
applicazioni per il Web.
Creazione e visualizzazione di un sito Web
1. Fai clic sul pulsante Avvia debug nella barra degli strumenti standard.
Visual Studio avvia il Server di sviluppo ASP.NET che esegue le applicazioni ASP.NET (nel
computer locale) per provare l'applicazione. Nella parte inferiore dello schermo viene
visualizzata una finestra di stato che riporta l'URL (Uniform Resource Locator) stabilito per il
computer, come illustrato nell'immagine seguente. Viene visualizzato anche un messaggio di
debug:
506 Parte IV Programmazione di database e per il Web
La finestra di dialogo Debug non attivato può essere fuoviante, ma non è un problema.
Visual Web Developer indica soltanto che il file Web.config del progetto correntemente non
consente il debug (una funzionalità standard di protezione). Nonostante sia possibile ignorare
questa finestra di dialogo a ogni verifica del funzionamento dell’applicazione in Visual Studio
facendo clic sul pulsante Esegui senza debug, si consiglia di modificare ora il file Web.config.
Suggerimento di protezione Prima di distribuire un sito Web sul campo, assicurati di
disattivare la funzione di debug in Web.config per garantire la protezione dell’applicazione da
manomissioni impreviste.
2. Fai clic su OK per modificare il file Web.config.
Visual Studio modifica il file, crea il sito Web e visualizza la pagina Web di introduzione in
Internet Explorer.
A questo punto, Car Loan Calculator ha l’aspetto mostrato nella pagina seguente. Se Internet
Explorer non viene visualizzato sullo schermo, può essere necessario selezionarlo nella barra
delle applicazioni di Windows.
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
507
Suggerimento di protezione Nella parte superiore della finestra di Internet Explorer,
potresti visualizzare la Barra informazioni nella quale è indicato che le impostazioni intranet
sono disabilitate per impostazione predefinita. L’avviso intranet è dovuto alla progettazione
di Internet Explorer che tanta proteggere il computer da programmi nocivi o da accessi non
autorizzati. L’intranet è una rete locale solitamente usata in ambienti domestici o per piccoli
gruppi di lavoro, e solitamente questo messaggio di avviso appare perché Visual Studio utilizza
un indirizzo in stile Intranet per il test dei siti Web creati sul proprio computer. Per eliminare
temporaneamente l’avviso, fai clic sulla Barra informazioni, quindi su Non visualizzare più questo messaggio. Per rimuovere in modo permanente gli avvisi relativi all’uso di un’Intranet, fai
clic sul comando Opzioni Internet nel menu Strumenti di Internet Explorer, quindi sulla scheda
Protezione e infine su Intranet locale. Fai clic sul pulsante Siti e deseleziona la casella di controllo
accanto a Rileva automaticamente rete Intranet nella finestra di dialogo Intranet locale. Tuttavia,
si consiglia di osservare la massima prudenza ogni volta che si decide di disattivare gli avvisi di
sicurezza, poiché essi sono concepiti per proteggere il sistema.
A questo punto è possibile tornare alle prove di funzionamento della pagina Web.
3. Digita 18000 nella casella di testo Loan Amount, quindi immetti 0,09 nella casella di testo
Interest Rate.
In questo modo la pagina calcola le rate da pagare per un finanziamento di 18.000 dollari al 9
% di interesse per 36 mesi, conveniente no?
508 Parte IV Programmazione di database e per il Web
4. Fai clic sul pulsante Calculate.
Visual Basic calcola l’importo da pagare e visualizza $572,40 nella casella di testo Monthly
Payment. Lo schermo sarà simile al seguente:
5. Chiudi Internet Explorer.
La verifica del funzionamento del sito Web è terminata per ora. La chiusura di Internet
Explorer termina il programma. Come puoi notare, la creazione e la visualizzazione di un sito
Web è essenzialmente identica alle corrispondenti operazioni per un’applicazione Windows,
tranne per il fatto che il sito Web viene eseguito in un browser. Se necessario, puoi anche
impostare punti di interruzione ed eseguire il debug dell’applicazione come avviene per le
applicazioni Windows.
A questo punto qualche lettore si sarà chiesto come installare un sito Web come questo su
un server Web reale. La procedura base per la distribuzione di siti Web consiste nel copiare i
file .aspx e ogni eventuale file di supporto necessario per il progetto in una directory virtuale
opportunamente configurata su un server Web che esegue IIS e .NET Framework 4. Questa
operazione di distribuzione può essere eseguita in Visual Web Developer in due modi. Per
iniziare, fai clic su Copia sito Web nel menu Sito Web, oppure su Pubblica Sito Web nel menu
Compila. (Visual Web Developer 2010 Express non fornisce il comando Pubblica sito Web.) Per
ulteriori informazioni sulle opzioni, vedere “Mappa del contenuto per la distribuzione di ASP.NET”
nella Guida in linea di Visual Studio. Per trovare un ISP in grado di ospitare le applicazioni Web
ASP.NET, visita il sito http://www.asp.net (informazioni in lingua inglese).
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
509
Convalida dei campi di input in una pagina Web
Nonostante l’utilità di questa pagina Web, essa causa un errore se l’utente dimentica
di immettere l’importo principale o il tasso di interesse, oppure se specifica dati in un
formato errato. Per rendere più affidabili i siti Web simili a questo, solitamente si consiglia
di aggiungere uno o più controlli di convalida che forzano l’immissione di informazioni
nel formato corretto da parte degli utenti. I controlli di convalida sono situati nella scheda
Convalida della Casella degli strumenti di Visual Web Developer e comprendono controlli
che richiedono l’immissione di dati in un campo (RequiredFieldValidator), l’immissione
di informazioni comprese in un determinato intervallo (RangeValidator) e così via. Per
informazioni sui controlli di convalida, consulta la Guida in linea di Visual Studio. L’impiego
dei controlli di convalida è molto semplice e lineare.
Personalizzazione del modello di sito Web
È arrivato così il momento di divertirci un po’. Solamente i siti Web più semplici sono formati da
una singola pagina Web. Con Visual Web Developer, è possibile espandere rapidamente il sito
Web per includere informazioni e risorse aggiuntive, tra cui pagine HTML e XML, file di testo,
record di database, servizi Web, sessioni di accesso, mappe del sito e altro ancora. Per aggiungere
una pagina Web, le opzioni disponibili sono tre.
■
Creare una nuova pagina Web utilizzando il modello Pagina HTML o Web Form. Per
selezionare questi modelli utilizza il comando Aggiungi nuovo elemento nel menu Sito
Web. Una volta creata la pagina, puoi aggiungere testo e oggetti con Web Page Designer.
■
Aggiungere una pagina Web creata precedentemente con il comando Aggiungi
elemento esistente nel menu Sito Web, quindi personalizzarla in Web Page Designer.
Questo metodo permette di includere una o più pagine Web già esistenti, create con
altri strumenti quali Expression Web. (Se possibile, ti consiglio di aggiungere pagine che
non siano basate su fogli di stile e risorse esterni, poiché ciò obbliga ad aggiungere al
progetto anche tali elementi.)
■
Utilizzare una pagina Web esistente che appartiene al modello di sito Web scelto. Ad
esempio, nel modello del sito Web aperto correntemente, sono presenti una pagina di
informazioni e varie pagine di accesso, personalizzabili e utilizzabili in modo semplice.
Nell'esercizio seguente, visualizzerai la pagina informativa fornita dal modello utilizzato e la
personalizzerai con alcune notizie sul funzionamento dell'applicazione del calcolatore delle rate
per l’acquisto di un'automobile.
Personalizzazione della pagina Web About.aspx
1. Visualizza Esplora soluzioni, fai clic sul file About.aspx e poi sul pulsante Progettazione.
Visual Web Designer visualizza About.aspx e una riga con il testo segnaposto ("Inserire il
contenuto qui") nella finestra di progettazione.
510 Parte IV Programmazione di database e per il Web
2. Elimina questo testo e sostituiscilo con le informazioni seguenti:
Car Loan Calculator
The Car Loan Calculator Web site was developed for the book Microsoft Visual
Basic 2010 Step by Step, by Michael Halvorson (Microsoft Press, 2010). The Web
site is best viewed using Microsoft Internet Explorer version 6.0 or later. To learn
more about how this ADO.NET application was created, read Chapter 20 in the
book.
Operating Instructions:
Type a loan amount, without dollar sign or commas, into the Loan Amount box.
Type an interest rate in decimal format into the Interest Rate text box. Do not
include the “%” sign. For example, to specify a 9% interest rate, type “0.09”.
Note that this loan calculator assumes a three-year, 36-month payment period.
Click the Calculate button to compute the basic monthly loan payment that does
not include taxes or other fees.
3. Tramite i pulsanti della barra degli strumenti Formato, aggiungi il grassetto per le intestazioni
e il corsivo per il titolo del libro, come mostrato di seguito:
4. Fai clic sul pulsante Salva tutto nella barra degli strumenti standard per salvare le modifiche.
5. Fai clic sul pulsante Avvia debug.
Visual Studio crea il sito Web e lo visualizza in Internet Explorer.
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
511
6. Fai clic sulla scheda Home page nella pagina Web.
Visual Studio visualizza la Home page del sito Web Car Loan Calculator.
7. Esegui un altro calcolo dell’importo da pagare per sperimentare il funzionamento della
pagina.
Per provare con una serie di valori differenti, prova a immettere 20000 come importo del
prestito e 0,075 come tasso di interesse. Il risultato dovrebbe essere $622,12.
8. A questo punto, fai clic sulla scheda Informazioni su per visualizzare la pagina Web con le
istruzioni del programma.
Internet Explorer mostra sullo schermo la pagina HTML Informazioni su. Il browser dovrebbe
essere simile al seguente:
9. Leggi il testo, quindi fai clic sul pulsante Indietro di Internet Explorer.
Come per qualsiasi altro sito Web, puoi fare clic sui pulsanti Indietro e Avanti per spostarti da
una pagina Web all’altra.
10. Chiudi Internet Explorer per chiudere il sito Web.
Hai così aggiunto una semplice pagina Informazioni su al tuo sito Web e hai provato
a spostarti da una pagina all'altra. Carino no? Ora passiamo a provare qualcosa di più
complicato, e vedere così ciò che è possibile ottenere quando si includono le informazioni
provenienti da un database in un sito Web.
512 Parte IV Programmazione di database e per il Web
Visualizzazione dei record di un database in una pagina
Web
Per molti utenti, uno degli aspetti più interessanti del World Wide Web è la capacità di accedere
rapidamente a grandi quantità di dati con un browser Web. Naturalmente, la quantità di
informazioni che deve essere visualizzata in un sito Web commerciale eccede di gran lunga ciò
che lo sviluppatore può provare a utilizzare impiegando semplici documenti di testo. In questi
casi, i programmatori Web aggiungono oggetti database ai propri siti Web per visualizzare
tabelle, campi e record contenenti informazioni provenienti da un database, e connettono tali
oggetti a un database protetto ubicato su un server Web o in altra località.
Visual Studio 2010 facilita il compito di visualizzare semplici tabelle di database in un sito Web,
pertanto all’aumentare delle esigenze di elaborazione è possibile usare Visual Studio per elaborare
ordini, gestire la sicurezza, gestire profili di informazioni cliente complessi e creare nuovi record
nei database, il tutto direttamente dal Web. Ancora più importante, Visual Web Developer mette
a disposizione queste potenti funzionalità con la massima efficienza. Ad esempio, il controllo
GridView permette di visualizzare una tabella di database contenente centinaia o migliaia di
record in una pagina Web senza la necessità di scrivere righe di codice. Il funzionamento di queste
funzioni può essere sperimentato completando l’esercitazione che segue, la quale aggiunge una
pagina Web contenente i dati di contatti per il prestito al progetto Car Loan Calculator. Se hai
completato le esercitazioni di programmazione dei database dei capitoli 18, e 19, fai attenzione
alle somiglianze (e ad alcune differenze) tra la programmazione dei database in ambiente
Windows e la stessa attività svolta per il Web.
Aggiunta di una nuova pagina Web per le informazioni provenienti da un database
1. Fai clic sul comando Aggiungi nuovo elemento nel menu Sito Web.
Visual Web Developer visualizza un elenco di componenti che possono essere aggiunti al sito
Web.
2. Fai clic sul modello Web Form, digita FacultyLoanLeads.aspx nella casella di testo Nome e
fai clic su Aggiungi.
Visual Web Developer aggiunge una nuova pagina al sito Web, che personalizzerai con un
testo e alcuni controlli server.
3. Fai clic sulla scheda Progettazione per passare alla visualizzazione Progettazione.
4. Immetti il testo che segue nella parte superiore della pagina Web:
The following grid shows instructors who want loans e their contact phone
numbers:
5. Premi due volte Invio per aggiungere due righe vuote sotto il testo.
Ricorda che i controlli di una pagina Web vengono aggiunti nel punto di inserimento corrente,
pertanto è sempre importante creare alcune righe vuote prima di aggiungere un controllo.
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
513
Fatto ciò, puoi visualizzare due campi della tabella Faculty del database Faculty2010.accdb
aggiungendo alla pagina Web il controllo GridView. GridView è simile al controllo DataGridView
usato nel capitolo 19, ma GridView è stato ottimizzato per l’impiego sul Web. (In realtà, vi sono
anche alcune altre piccole differenze che è possibile esaminare nella finestra Proprietà e nella
Guida in linea di Visual Studio.) Nota che qui viene utilizzata la stessa tabella del database Access
già impiegata nei capitoli 18 e 19, pertanto è possibile vedere le somiglianze tra la programmazione
dei database in Visual Web Developer. Molti programmatori utilizzano nei propri siti Web anche
database SQL, e Visual Web Developer permette di gestire perfettamente anche questo formato.
Aggiunta di un controllo GridView
1. Con la nuova pagina Web aperta e il punto di inserimento nella posizione desiderata, fai
doppio clic sul controllo GridView nella scheda Dati della Casella degli strumenti di Visual
Web Developer.
Visual Web Developer aggiunge alla pagina Web un oggetto visualizzazione griglia chiamato
GridView1. Questo oggetto contiene informazioni segnaposto.
2. Se l’elenco Attività di GridView non è già visualizzato, fai clic sullo smart tag dell’oggetto
GridView1 per visualizzarlo.
3. Fai clic sulla freccia della casella Selezionare un’origine dati, quindi sull’opzione <Nuova
origine dati>.
4. Visual Web Developer avvia la procedura Configurazione guidata origine dati, uno strumento
già usato nei capitoli 18 e 19 per stabilire una connessione con un database e selezionare le
tabelle e i campi che devono formare il dataset.
Lo schermo sarà simile al seguente:
514 Parte IV Programmazione di database e per il Web
5. Fai clic sull’icona Access Database, digita Faculty2010 nella casella Specificare l’ID dell’origine
dati e fai clic su OK.
Il sistema chiede quindi di indicare il percorso del database Access sul computer. (Come puoi
vedere, questa finestra di dialogo è leggermente differente da quella incontrata nel capitolo
18.)
6. Digita C:\Vb10sbs\Chap18\Faculty2010.accdb e fai clic su Avanti.
Nota Se visualizzi un messaggio nel quale è indicato che il provider Microsoft.ACE.
OLEDB.12.0 non è registrato nel computer locale, significa che probabilmente non è installato
Access 2007 o versione successiva In questo caso, scarica e installa Office System Driver: Data
Connectivity Components 2007 dal sito Microsoft.com.
Il sistema ora chiede di configurare l’origine dati, cioè di selezionare la tabella e i campi da
visualizzare nella pagina Web. In questo caso dovrai utilizzare due campi della tabella Faculty.
(Ricorda che in Visual Studio i campi di un database vengono spesso definiti colonne, pertanto
nell’IDE e nelle istruzioni che seguono appare il termine colonne.)
7. Fai clic sulla freccia della casella Nome, quindi su Faculty. (Probabilmente, in questo caso sono
presenti una o due tabelle database, ma se ce ne fossero di più, fai clic sulla freccia Nome per
visualizzarle.)
8. Seleziona le caselle di controllo Last Name e Business Phone nella casella di riepilogo
Columns.
Lo schermo sarà simile al seguente:
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
515
Mediante queste operazioni, stai creando un'istruzione SQL SELECT per configurare un
dataset che rappresenta una porzione del database Facutly2010.accdb. Puoi visualizzare
l'istruzione SELECT nella parte inferiore di questa finestra di dialogo.
9. Fai clic su Avanti per passare alla schermata Test query.
10. Fai clic sul pulsante Test query per vedere l’anteprima dei dati.
Viene così visualizzata l’anteprima dei campi Last Name e Business Phone presenti nel
database. Questi dati hanno l’aspetto previsto, ma durante la preparazione dei sito Web
per la distribuzione è consigliabile compiere un’operazione aggiuntiva per formattare la
colonna Business Phone in modo da utilizzare una spaziatura e una formattazione dei numeri
telefonici standard.
11. Fai clic su Fine.
Visual Web Developer chiude la procedura guidata e imposta il numero di colonne e
intestazioni di colonna nell’oggetto visualizzazione griglia in modo da adattarlo alle scelte
appena specificate. Tuttavia, nelle celle visualizzazione griglia sullo schermo sono ancora
presenti informazioni segnaposto (“abc”).
12. Con l’elenco Attività di GridView ancora aperto, fai clic sul comando Formattazione
automatica.
13. Fai clic sullo schema Professionale.
La finestra di dialogo Formattazione automatica è simile alla seguente:
La possibilità di formattare, modificare e vedere l’anteprima delle opzioni di formattazione è
un’utile funzione del controllo GridView.
14. Fai clic su OK e chiudi l’elenco Attività di GridView.
La pagina Web FacultyLoanLeads.aspx è ora completa e dovrebbe apparire come mostrata
nella pagina seguente. (Nota che nell’esempio il controllo GridView si trova racchiuso tra tag
<div>, mentre nel tuo caso potrebbe apparire tra i tag <p>.)
516 Parte IV Programmazione di database e per il Web
Ora puoi procedere all’aggiunta di un collegamento ipertestuale nella prima pagina Web (o home
page) che visualizzi questa pagina Web quando l’utente desidera vedere la tabella del database.
Creerai il collegamento ipertestuale mediante il controllo HyperLink, progettato per consentire
agli utenti di passare dalla pagina Web corrente a un'altra con un semplice clic del mouse.
Il funzionamento di questo controllo è il seguente: esso si trova nella barra degli strumenti
Standard; quando aggiungi un controllo HyerLink nella pagina Web, puoi impostare il testo da
visualizzare nella pagina utilizzando la proprietà Text, quindi puoi specificare la pagina Web o
la risorsa a cui desideri passare, ad esempio un URL o un percorso locale, tramite la proprietà
NavigateUrl. Questo è tutto ciò che è necessario fare.
Aggiunta di un collegamento ipertestuale alla home page
1. Fai clic sulla scheda Default.aspx nella parte superiore della finestra Progettazione.
Nella finestra Progettazione viene visualizzata la home page del sito Web.
2. Fai clic a destra dell'oggetto pulsante Calculate per inserire un punto di inserimento dopo lo
stesso.
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
517
3. Premi Invio per creare spazio l'oggetto collegamento ipertestuale.
4. Fai doppio clic sul controllo HyperLink nella scheda Standard della Casella degli strumenti per
creare un oggetto collegamento ipertestuale nel punto di inserimento.
5. Seleziona l'oggetto collegamento ipertestuale e imposta la proprietà Text dell’oggetto su
“Display Loan Prospects”.
In questo caso si presume che gli utenti siano addetti ai prestiti di una banca (o venditori di
automobili bene informati) che cercano di vendere automobili a docenti universitari. Display
Loan Prospects sarà il collegamento su cui essi faranno clic per visualizzare i record del
database selezionato.
6. Imposta la proprietà ID dell’oggetto collegamento ipertestuale su “lnkProspects”.
7. Fai clic sulla proprietà NavigateUrl, quindi sul pulsante con i puntini di sospensione nella
seconda colonna.
Viene visualizzata la finestra di dialogo Seleziona URL.
8. Fai clic sul file FacultyLoanLeads.aspx nella casella di riepilogo Contenuto cartella, quindi su
OK.
9. Fai clic sul pulsante Salva tutto per salvare le modifiche.
Il collegamento è completo e ora è possibile procedere alla verifica del funzionamento del sito
Web e del controllo GridView nel browser.
Test del sito Web Car Loan Calculator finale
Suggerimento Il sito Web Car Loan Calculator completo è disponibile nella cartella C:\
Vb10sbs\Chap20\Chap20. Per aprire un sito Web esistente, utilizza il comando Apri sito Web
nel menu File.
1. Fai clic sul pulsante Avvia debug.
Visual Studio crea il sito Web e lo visualizza in Internet Explorer.
2. Immetti 8000 come importo del prestito e 0,08 come tasso di interesse, quindi fai clic su
Calculate.
Il risultato è $250,69. A ogni modifica o aggiunta a un progetto, si consiglia di verificare
il funzionamento delle funzioni originali per controllare che non siano state alterate
inavvertitamente. Lo schermo dovrebbe apparire simile all’immagine che segue.
518 Parte IV Programmazione di database e per il Web
Il nuovo collegamento ipertestuale (Display Loan Prospects) risulta visibile nella parte inferiore
della pagina Web.
3. Fai clic su Display Loan Prospects per caricare la tabella del database.
Internet Explorer carica i campi Last Name e Business Phone dal database Faculty2010.accdb
nell’oggetto visualizzazione griglia. La pagina Web dovrebbe avere il seguente aspetto:
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
519
Le informazioni sono formattate correttamente e perfettamente leggibili. Per impostazione
predefinita, i dati di questa tabella non possono essere ordinati, ma è possibile modificare
questa situazione selezionando la casella di controllo Attiva ordinamento in Attività di
GridView. Se il database contiene molte righe (record) di informazioni, è possibile selezione la
casella di controllo Attiva paging in Attività di GridView per visualizzare un elenco di numeri
di pagina nella parte inferiore della pagina Web (come avviene in un motore di ricerca che
mostra più pagine di risultati della ricerca).
4. Fai clic sui pulsanti Indietro e Avanti in Internet Explorer.
Come hai già appreso in precedenza, è possibile spostarsi tra le pagine Web del sito come
avviene in qualsiasi sito Web professionale.
5. Al termine delle prove, chiudi Internet Explorer per chiudere il sito Web.
Hai così aggiunto una tabella di informazioni di database personalizzate senza scrivere nemmeno
una riga di codice!
Procedura aggiuntiva: Impostazione del titolo di un
sito Web in Internet Explorer
Se desideri eseguire altre prove, ecco ancora un paio di suggerimenti per la programmazione
Web, che permettono di migliorare il sito Web e offrono spunti per possibili sviluppi successivi.
Come avrai notato, durante la verifica del funzionamento del sito Web Car Loan Calculator, Internet
Explorer mostra “Home page” nella barra del titolo e nella scheda della finestra. All'inizio della finestra,
il programma visualizza anche il titolo del modello "APPLICAZIONE ASP.NET PERSONALE" con un
carattere di grandi dimensioni. In altre parole, la schermata visualizzata ha il seguente aspetto:
Se necessario, ciò che Internet Explorer e gli altri browser visualizzano nella barra del titolo può
essere personalizzato impostando la proprietà Title dell’oggetto DOCUMENT della pagina Web;
puoi cambiare anche la stringa "APPLICAZIONE ASP.NET PERSONALE" modificando la pagina
master del sito. Adesso, esegui qualche prova di modifica di entrambi i valori.
Impostazione delle proprietà Title
1. Con la pagina Web Default.aspx aperta nella visualizzazione Progettazione, fai clic sull’oggetto
DOCUMENT nella casella di riepilogo Oggetto nella parte superiore della finestra Proprietà.
520 Parte IV Programmazione di database e per il Web
Ogni pagina Web di un sito Web contiene un oggetto DOCUMENT in cui sono memorizzate
importanti impostazioni generali della pagina stessa. Tuttavia, l’oggetto DOCUMENT non
viene selezionato per impostazione predefinita nella finestra Progettazione, e ciò spesso non
viene notato dall’utente. Title è una delle proprietà più importanti dell’oggetto DOCUMENT,
quella che imposta il titolo della pagina Web corrente mostrato nel browser.
2. Imposta la proprietà Title su “Car Loan Calculator”.
La modifica non viene mostrata sullo schermo , ma Visual Web Developer la memorizza
internamente. A questo punto, modifica il titolo dell'applicazione nella pagina master del sito.
Modifica del titolo della pagina master
1. Fai clic sul file Site.Master in Esplora soluzioni, quindi sul pulsante Visualizza finestra di
progettazione.
Visual Studio visualizza la pagina master nella finestra di progettazione. La pagina master è
un modello che fornisce impostazioni predefinite per il sito Web e consente di modificarne
le caratteristiche, come aspetto, intestazioni, menu e collegamenti. Ad esempio, puoi
selezionare gli smart tag associati agli elementi di menu del sito Web e modificarli come è
stato fatto nel capitolo 4.
Lo schermo sarà simile al seguente:
Capitolo 20
Creazione di siti e pagine Web con Visual Web Developer e ASP.NET
521
2. Elimina il titolo “APPLICAZIONE ASP.NET PERSONALE” e digita TIME FOR A NEW CAR?
Visual Web Designer immette il nuovo titolo. Adesso, esegui nuovamente il sito Web.
3. Fai clic sul pulsante Avvia debug.
Visual Studio apre Internet Explorer e carica il sito Web. Viene visualizzata una barra del titolo
e un'intestazione più adatta, come mostrato nell’immagine che segue:
Adesso il sito è personalizzato.
4. Chiudi Internet Explorer e aggiorna le proprietà Title delle altre pagine Web del sito.
5. Una volta completate le prove, salva le modifiche e chiudi Visual Studio.
Hai completato l’intero corso di programmazione Microsoft Visual Basic 2010 Passo per passo.
Se possibile, dedica qualche momento a rivedere quanto appreso con la lettura di questo
manuale. Ora sei pronto ad affrontare sfide più impegnative e tecniche di programmazione
complesse nella programmazione con Visual Basic. L’elenco di risorse nell’appendice contiene
alcuni spunti e suggerimenti su come continuare nell’apprendimento. Ma ora ti meriti proprio un
po’ di riposo!
522 Parte IV Programmazione di database e per il Web
Riferimenti rapidi del capitolo 20
Obiettivo
Azione
Creazione di un nuovo sito Web
ASP.NET
Fai clic sul comando Nuovo sito Web nel menu File, quindi sul modello
Sito Web ASP.NET, specifica l’ubicazione della cartella nella casella di
riepilogo Percorso Web, quindi fai clic su OK.
Passaggio dalla visualizzazione
Progettazione alla visualizzazione
Origine in Web Page Designer
Fai clic sulle schede Origine o Progettazione in Web Page Designer.
In alternativa, fai clic sulla scheda Dividi per visualizzare entrambe le
finestre.
Immissione di testo in una pagina
Web
Fai clic sulla scheda Progettazione, quindi digita il testo da aggiungere.
Formattazione del testo in una
pagina Web
All’interno della pagina, seleziona il testo che desideri formattare e fai clic
su un pulsante o controllo nella barra degli strumenti di formattazione.
Nel menu Formato, sono disponibili altre opzioni.
Visualizzazione del codice HTML e
ASP.NET nella pagina Web
Fai clic sulla scheda Origine in Web Page Designer.
Aggiunta di controlli a una pagina
Web
Visualizza la pagina Web nella visualizzazione Progettazione, apri la Casella
degli strumenti (la quale contiene automaticamente i controlli di Visual
Web Developer), posiziona il punto di inserimento dove desideri inserire il
controllo, e infine fai doppio clic sul controllo nella Casella degli strumenti.
Modifica del nome di un oggetto
in una pagina Web
Utilizza la finestra Proprietà per modificare la proprietà ID dell’oggetto
con un nuovo nome.
Creazione della routine evento
predefinita per un oggetto in una
pagina Web
Fai doppio clic sull’oggetto per visualizzare il file del codice, quindi
immetti il codice della routine evento per l’oggetto nell’editor di codice.
Verifica del formato dei dati
immessi dall’utente in un controllo
di una pagina Web
Utilizza uno o più controlli di convalida nella scheda Convalida della
Casella degli strumenti per verificare i dati immessi.
Esecuzione e verifica di un sito
Web in Visual Studio
Fai clic sul pulsante Avvia debug nella barra degli strumenti standard.
Visual Studio crea il progetto, avvia Server di sviluppo ASP.NET e carica il
sito Web in Internet Explorer.
Creazione di una pagina Web per
un progetto
Fai clic sul comando Aggiungi nuovo elemento nel menu Sito Web,
quindi aggiungi al progetto il nuovo modello Web Form o Pagina HTML.
Crea e formatta la pagina utilizzando Web Page Designer.
Creazione di un collegamento ad
altre pagine Web del sito
Aggiungi un controllo HyperLink alla pagina Web, quindi imposta la sua
proprietà NavigateUrl sull’indirizzo della pagina Web collegata.
Visualizzazione dei record di un
database in una pagina Web
In Web Page Designer, aggiungi un controllo GridView a una pagina
Web. Stabilisci una connessione con il database e formatta i dati
mediante i comandi dell’elenco Attività di GridView. (Nota che il
comando Seleziona connessione dati avvia la procedura Configurazione
guidata origine dati.)
Impostazione del titolo delle
pagine Web visualizzato nella
barra del titolo di Internet Explorer
Per ogni pagina Web, modifica la finestra Proprietà per impostare la
proprietà Title dell’oggetto DOCUMENT.
Modifica di intestazione, menu e
altri valori predefiniti nella pagina
master
Fai clic sul file Site.Master in Esplora soluzioni, quindi sul pulsante
Visualizza finestra di progettazione. Modifica i valori predefiniti della
pagina master nella finestra di progettazione.