Parte IV Programmazione di database e per il Web Parte IV Programmazione di database e per il Web...

84
439 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, modicare ed esaminare il contenuto di un database utilizzando una combinazione di codice e controlli dei Windows Form. Microsoft Visual Studio 2010 è stato progettato specicamente 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ò signica 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.

Transcript of Parte IV Programmazione di database e per il Web Parte IV Programmazione di database e per il Web...

439

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, modifi care ed esaminare il contenuto di un database utilizzando una combinazione di codice e controlli dei Windows Form. Microsoft Visual Studio 2010 è stato progettato specifi camente 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ò signifi ca 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.

441

Capitolo 18

Introduzione ad ADO.NETAl termine di questo capitolo sarai in grado di:

■ Utilizzare la procedura Confi gurazione guidata origine dati per stabilire una connessione con un database e creare un dataset.

■ Utilizzare le fi nestre 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 fi ltrare 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 Confi gurazione 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 fi nestre 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 fi ltrare i dataset e di conseguenza ciò che gli utenti potranno vedere e utilizzare.

Programmazione di database con ADO.NETUn database è una raccolta organizzata di informazioni memorizzata in un fi le. 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 fi le 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-profi t 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.

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, affi nché potesse funzionare con numerosi scenari di accesso dati, e ottimizzato in modo specifi co 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 databaseIl 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 specifi che 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 modifi care le informazioni contenute in un database. Per prima cosa viene stabilita una connessione che specifi ca le informazioni di connessione necessarie per quel database e crea ciò a cui altri controlli e componenti si dovranno associare. Fatto ciò, la procedura Confi gurazione 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 Confi gurazione guidata origine dati aggiunge anche un fi le 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 modifi che 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 fi nestra 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 AccessNelle sezioni seguenti, apprenderai come utilizzare la tecnologia di accesso ai dati ADO.NET di Visual Basic 2010. Inizierai con la Confi gurazione 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 confi gurazione del sistema, possono servire alcuni componenti di connettività di Microsoft per utilizzare i fi le 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 fi le in Access per utilizzarlo, dovrai avere Access 2007 o Access 2010 installato nel sistema.

Stabilire una connessione utilizzando la procedura Confi gurazione 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.

Stabilire una connessione utilizzando la procedura Confi gurazione guidata originedati

Capitolo 18 Introduzione ad ADO.NET 445

La procedura Confi gurazione 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 infi ne crea un dataset o un'entità dati all’interno del programma in cui memorizzare tabelle e campi specifi ci del database. Come risultato, la procedura guidata apre la fi nestra 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 Confi gurazione 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à specifi ci 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 fi le, 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 Confi gurazione guidata origine dati, e si raccomanda di proteggere dagli accessi non autorizzati i fi le 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 fi nestra di dialogo Seleziona origine dati che chiede di selezionare il formato di database che prevedi di utilizzare. Se compare la fi nestra di dialogo Aggiungi connessione invece della fi nestra di dialogo Seleziona origine dati, ciò signifi ca solamente che la copia di Visual Studio è già stata confi gurata per un particolare formato di database.

In questo caso, fai semplicemente clic sul pulsante Modifi ca nella fi nestra di dialogo Aggiungi connessione e visualizzerai la stessa fi nestra apparsa la prima volta che hai avviato la procedura guidata, ad eccezione del fatto che la barra del titolo indica Modifi ca 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 fi nestra di dialogo Modifi ca/Seleziona origine dati è il luogo in cui puoi selezionare il formato di database preferito, quello cioè che Visual Studio deve utilizzare come predefi nito. In questo capitolo, devi selezionare il formato di Access, ma ricorda che questa impostazione può essere modifi cata 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 fi nestra di dialogo Aggiungi connessione, mostrata nell’immagine che segue:

Ora puoi procedere a specifi care il percorso e le impostazioni di connessione del database, affi nché Visual Studio possa creare una stringa di connessione valida.

8. Fai clic su Sfoglia.

Viene visualizzata la fi nestra di dialogo Seleziona fi le di database Microsoft Access, che funziona come una normale fi nestra 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 fi nestra di dialogo Aggiungi connessione viene visualizzata nuovamente con il percorso specifi cato. L'accesso a questo fi le 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 specifi carli 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 specifi cato 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 signifi ca che probabilmente non è installato Access 2007 o versione successiva In questo caso, scarica e installa Offi ce System Driver: Data Connectivity Components 2007 dal sito Microsoft.com. (Vedere la fase 1 sopra.)

11. Fai clic su OK per chiudere la fi nestra, quindi nuovamente su OK per chiudere la fi nestra di dialogo Aggiungi connessione.

Visual Studio visualizza nuovamente la procedura Confi gurazione guidata origine dati.

12. Fai clic sul segno più (+) accanto alla voce Stringa di connessione nella fi nestra 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 identifi ca 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 Confi gurazione guidata origine dati pone quindi la seguente domanda: “Salvare la stringa di connessione nel fi le di confi gurazione dell’applicazione?” La risposta predefi nita è affermativa, e il nome della stringa proposto in questo esempio è Faculty2010ConnectionString. Solitamente si desidera salvare questa stringa all’interno del fi le di confi gurazione dell’applicazione, poiché se l’ubicazione del database cambia è possibile modifi carla in tale fi le (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 predefi nita.

A questo punto il programma chiede di selezionare il sottoinsieme di oggetti database che desideri utilizzare in questo progetto, come mostrato nella fi nestra 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 fi nestra 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 predefi nito Faculty2010DataSet che può essere modifi cato nella casella Nome DataSet.

Suggerimento Nota che il dataset creato ora è solamente una rappresentazione dei dati presenti nel database; infatti, se aggiungi, elimini o modifi chi i record del database nel dataset, in realtà le tabelle del database sottostante vengono modifi cate solo quando esegui un coman-do 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 Confi gurazione guidata origine dati.

Visual Studio completa l’aggiunta al progetto della connessione al database e la confi gurazione del dataset con gli oggetti database selezionati. (A seconda di come è stata utilizzata e confi gurata l’IDE di Visual Studio, possono essere visualizzate la scheda o la fi nestra Origini dati.)

19. Fai clic sul pulsante Salva tutto nella barra degli strumenti standard per salvare le modifi che. Specifi ca il percorso della cartellaC:\Vb10sbs\Chap18.

20. Se Esplora soluzioni non è completamente visibile, aprilo per visualizzare i fi le 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 fi le 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 fi le dello schema signifi ca che al progetto è stato aggiunto un dataset tipizzato. (I dataset tipizzati sono associati a un fi le 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 specifi che sui campi e le tabelle utilizzati.

21. Fai clic sul fi le dello schema Faculty2010DataSet.xsd in Esplora soluzioni, quindi sul pulsante Visualizza fi nestra di progettazione.

La rappresentazione di tabelle, campi e comandi data adapter relativi al nuovo dataset viene visualizzata in uno strumento chiamato fi nestra Progettazione DataSet. La fi nestra 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 fi nestra Progettazione DataSet permette di creare e modifi care i table adapter e le loro query, le tabelle e le colonne di dati e le relazioni tra dati. La fi nestra 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 fi nestra Proprietà.

23. Fai clic sulla proprietà MaxLength. Il form dovrebbe risultare simile all'immagine seguente:

In questa immagine, la fi nestra Progettazione DataSet è mostrata con un dataset attivo chiamato Faculty2010DataSet, mentre la fi nestra 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 suffi ciente, è possibile modifi care questa proprietà (o altre) qualora le impostazioni del database sottostante risultino inadeguate per l’applicazione.

Lasciando temporaneamente da parte la fi nestra Progettazione DataSet, la prossima sezione prosegue con la creazione dell’applicazione database di esempio nella fi nestra Origini dati.

La fi nestra Origini datiLa fi nestra 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 confi gurati 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 Confi gurazione guidata origine dati. Il dataset viene mostrato sotto forma di una struttura gerarchica nella fi nestra 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 fi nestra 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 fi nestra Origini dati. Per prepararti agli esercizi che seguono e vedere la fi nestra 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 fi nestra Origini dati, espandi la tabella Faculty in modo da poter vedere i due campi selezionati. La fi nestra Origini dati dovrebbe avere il seguente aspetto:

Nella parte superiore della fi nestra sono presenti quattro utili strumenti che consentono di utilizzare i dataset. Essi consentono, da sinistra a destra, di aggiungere un nuovo dataset al progetto, modifi care 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 fi nestra Origini dati alla fi nestra Progettazione Windows Form. (Questa è la stessa fi nestra di progettazione usata nei capitoli precedenti, ma qui viene chiamata Progettazione Windows Form per distinguerla dalla fi nestra 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 fi nestra Origini dati per creare oggetti database in un form

1. Nella fi nestra Origini dati, fai clic sulla freccia vicina al nodo Faculty per visualizzare i campi disponibili in Faculty2010DataSet (se non l'hai già fatto).

La fi nestra 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 fi nestra Origini dati, a destra del campo Last Name viene visualizzata una freccia. Se la freccia non risulta visibile, assicurati che nella fi nestra 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 predefi nito 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

Utilizzo della fi nestra Origini dati per creare oggetti database in un form

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 fi nestra 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 Confi gurazione 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 modifi cati o eliminati mediante le proprietà Items dell’oggetto binding navigator nella fi nestra 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 verifi care che il programma operi davvero su dati disconnessi e senza eseguire alcuna modifi ca 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 specifi che 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 Confi gurazione 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 fi nestra 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, confi gurare 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 defi nito 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 predefi nita, 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 fi nestra di dialogo Maschera input che elenca alcuni tipi di maschere numeriche predefi nite. 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.)

Associazione di un controllo casella di testo mascherata a un oggetto dataset

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 fi nestra 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; è suffi ciente trascinare il campo Business Phone dalla fi nestra Origini dati nell'oggetto che si desidera associare ai dati, in questo caso MaskedTextBox1.

7. Visualizza la fi nestra 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 fi nestra 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 fi nestra Proprietà, per indicare che l’oggetto è associato a un dataset.

8. Verifi ca che l’oggetto MaskedTextBox1 sia selezionato nel form, quindi premi il tasto F4 per passare alla fi nestra 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 fi nestra 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 modifi care rapidamente l’origine dati cui è associato il controllo.)

10. Fai clic sul form per chiudere tutti i riquadri aperti della fi nestra 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 modifi che.

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 fi ltro dei dati

La procedura Confi gurazione 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 fi ltro 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 fi ltro 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 fi ltrare, le informazioni da una o più tabelle strutturate di un database. Il motivo dell’applicazione di questi fi ltri è 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 fi ltrati 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 fi nestra Progettazione è selezionato un oggetto associato, ad esempio Last_NameTextBox. Viene visualizzata la fi nestra di dialogo Generatore di criteri per la ricerca, come mostrato nell’immagine che segue:

Questa fi nestra di dialogo permette di organizzare e visualizzare le proprie query create da Generatore di query e formate da istruzioni SQL. La tabella predefi nita che viene organizzata mediante la query (Faculty2010DataSet.Faculty) può essere selezionata nella casella Seleziona tabella origine dati nella parte superiore della fi nestra di dialogo. Il nome della tabella indica anche il formato gerarchico dell’oggetto, in questo caso “la tabella Faculty all’interno del dataset Faculty2010DataSet”.

Creazione di istruzioni SQL con Generatore di query

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 predefi nita 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 fi nestra 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 fi nestra 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'effi cacia 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 fi nestra 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 fi nestra 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 fi nestra 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 fi gura 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 verifi ca 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 fi nale visualizzerà i record database in un sito Web.

Riferimenti rapidi del capitolo 18Obiettivo Azione

Come stabilire una connessione con un database

Fai clic sul comando Aggiungi nuova origine dati nel menu Dati, quindi utiliz-za la procedura Confi gurazione guidata origine dati per localizzare il databa-se cui desideri fornire accesso creando una stringa di connessione.

Creazione di un dataset Con Confi gurazione guidata origine dati, specifi ca il nome del dataset nella casella Nome DataSet, espandi il nodo Tabelle nella visualizzazione della struttura del database mostrata e specifi ca 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 Confi gurazione guidata origine dati, apri la fi nestra 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 fi nestra 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 fi nestra Origini dati in un Windows Form nella fi nestra 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 Modifi ca 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 fi ltrare 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 stru-menti del Windows Form. Una volta appreso l’uso del Generatore di query, è possibile procedere alla sperimentazione dell’uso di LINQ.

Obiettivo Azione

467

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.

■ Modifi care 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 modifi che nelle celle di una griglia e salvare le modifi che 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 fi le 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

468 Parte IV Programmazione di database e per il Web

poi come aggiungere più oggetti visualizzazione griglia dati in un form. Infi ne, si esamina come impostare le proprietà DataGridView, tra cui la proprietà ReadOnly che consente o impedisce all’utente di salvare le modifi che 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 Confi gurazione guidata origine dati e la fi nestra 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 Confi gurazione 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 fi nestra 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 specifi cato automaticamente, come mostrato nell’immagine che segue.

Creazione della connessione con una tabella di un database

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 fi le 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 predefi nito, cioè nel fi le di confi gurazione del progetto.

A questo punto il programma chiede di selezionare gli oggetti database da utilizzare per questo particolare progetto. Ricorda che la Confi gurazione 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 suffi cienti 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 salva-taggio saranno illustrate alla fi ne 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 ori-ginale.

La pagina della procedura guidata dovrebbe apparire come mostrato nell’immagine che segue.

9. Fai clic su Fine per chiudere la Confi gurazione guidata origine dati.

Visual Studio crea un dataset chiamato Faculty2010DataSet che rappresenta gli otto oggetti database selezionati. Inoltre, Visual Studio aggiunge fi le XML chiamato Faculty2010DataSet.xsd al tuo progetto e nella fi nestra 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. Specifi ca la cartella C:\Vb10sbs\Chap19 come percorso di salvataggio.

11. Fai clic sulla scheda Origini dati per aprire la fi nestra 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 fi nestra 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 fi nestra 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 fi ne del capitolo, avrai posizionato nel form due oggetti visualizzazione griglia dati affi ancati, 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 fi nestra Origini dati per l’operazione che segue.

2. Nella fi nestra 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 fi nestra Origini dati dovrebbe avere il seguente aspetto:

Creazione di un oggetto visualizzazione griglia dati

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 predefi nita), che visualizza una griglia di colonne e righe che rappresentano i campi e i record presenti nella tabella Faculty.

❏ Dettagli, che confi gura 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 fi nestra 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 fi gura 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 suffi ciente 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 fi nestre di grandi dimensioni.

5. Utilizza la fi nestra 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 modifi care le impostazioni base è semplifi cata 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 modifi care la tabella associata all’oggetto visualizzazione griglia dati e per abilitare o disabilitare la modifi ca all’interno della visualizzazione griglia. Per impostazione predefi nita, l’utente dispone di capacità limitate di modifi ca delle informazioni nella tabella, nonostante sia comunque possibile controllare se tali modifi che debbano essere salvate nel database sottostante. Puoi anche modifi care le colonne visualizzate, ancorare la griglia al contenitore principale (in questo caso il form), fi ltrare record tramite una query (istruzione SQL) e visualizzare l’anteprima dei dati nella tabella.

2. Fai clic su Anteprima dati per aprire la fi nestra di dialogo Anteprima dati.

Questa fi nestra di dialogo viene visualizzata quando si desidera esaminare i dati contenuti nella tabella prima di eseguire realmente il programma.

Anteprima dei dati associati a un oggetto visualizzazione griglia dati

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 fi gura. 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 fi nestra 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 Modifi ca colonne.

Viene visualizzata la seguente fi nestra di dialogo Modifi ca colonne:

La fi nestra di dialogo Modifi ca colonne permette di aggiungere o rimuovere le colonne visualizzate nell’oggetto visualizzazione griglia dati. Come illustrato più avanti in questo capitolo, questa fi nestra di dialogo può essere impiegata anche per modifi care 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 modifi cate nel database Faculty2010.accdb sottostante.

2. Fai clic sulla colonna ID nella fi nestra 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 modifi che, 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.

Rimozione di colonne da un oggetto visualizzazione griglia dati

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 modifi che.

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:

Gestione di un oggetto visualizzazione griglia dati in fase di esecuzione

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 fi nestra 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 fi no 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 predefi nita 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’identifi cazione 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 rifl ette 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 modifi care la larghezza predefi nita 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 modifi care 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 fi nestra Proprietà, fai clic sulla proprietà Columns, quindi sul pulsante con i puntini di sospensione (. . .) nella seconda colonna per aprire la fi nestra di dialogo Modifi ca colonne.

Questa fi nestra 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 modifi cherai la larghezza predefi nita 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 suffi ciente 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.

Impostazione della proprietà di visualizzazione della griglia dati in fase di progettazione

480 Parte IV Programmazione di database e per il Web

5. Fai clic su OK per chiudere la fi nestra di dialogo Modifi ca colonne.

Fatto ciò, puoi passare a impostare le proprietà che controllano l’aspetto di tutte le colonne della tabella.

Nota Per confi gurare le singole colonne è possibile servirsi della fi nestra di dialogo Modifi ca colonne. Per modifi care le proprietà valide per tutte le colonne di una tabella, è necessario mo-difi care le proprietà dell’oggetto visualizzazione griglia dati nella fi nestra Proprietà.

6. Nella fi nestra Proprietà, imposta la proprietà ColumnHeadersVisible su False.

Nonostante i nomi delle colonne di questo database siano decisamente espliciti, in alcuni casi non consentono di identifi care 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. Modifi cando 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 fi nestra 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 infi ne sul colore giallo chiaro.

La fi nestra di dialogo dovrebbe avere il seguente aspetto: Il colore giallo non è visibile nel libro, ma lo puoi notare nella fi nestra di dialogo.

Capitolo 19 Presentazione dei dati mediante il controllo DataGridView 481

9. Fai clic su OK nella fi nestra 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 modifi care il colore di tutte le celle di una visualizzazione griglia dati, è possibile servirsi della proprietà DefaultCellStyle. Per cambiare il colore di sfon-do usato per le celle di intestazione (se visualizzate), è possibile modifi care la proprietà ColumnHeadersDefaultCellStyle.

10. Fai clic sulla proprietà GridColor, quindi sulla freccia nella seconda colonna, poi sulla scheda Personalizzato e infi ne sul colore Navy (blu scuro).

Questa proprietà controlla il colore delle linee della griglia. Se modifi chi il colore dello sfondo delle celle, puoi voler modifi care anche il colore delle linee della griglia.

Ora puoi eseguire il programma per vedere l’effetto delle modifi che 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 fi gura 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 fi nestra 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 fi nestra 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 fi nestra Origini dati (se non è già aperta).

3. Trascina la tabella Faculty dalla fi nestra Origini dati fi no 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 Modifi ca colonne.

Viene visualizzata la fi nestra di dialogo Modifi ca 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:

Associazione di un secondo controllo DataGridView alla tabella Faculty

Capitolo 19 Presentazione dei dati mediante il controllo DataGridView 483

6. Fai clic su OK per chiudere la fi nestra di dialogo Modifi ca 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 modifi che.

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 fi gura:

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 fi ltrati 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 formSe 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 fi nestra 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 Modifi ca 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. Modifi ca la proprietà BindingSource del secondo oggetto navigatore all'origine di associazione della seconda tabella. Ciò viene semplifi cato dalla freccia BindingSource della fi nestra 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 modifi che 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 modifi care le informazioni nell’oggetto FacultyDataGridView. Inoltre, apprenderai l’utilizzo del pulsante Salva dati, il quale memorizza le modifi che nelle tabelle del database originale su disco.

486 Parte IV Programmazione di database e per il Web

Abilitazione delle modifi che in un database

1. Fai clic sul primo oggetto visualizzazione griglia dati sul form (FacultyDataGridView).

2. Nella fi nestra Proprietà, scorri fi no alla proprietà ReadOnly, poi analizza l'impostazione della relativa proprietà.

Se la proprietà ReadOnly è impostata su False, l’utente è in grado di eseguire modifi che alle informazioni nelle celle della visualizzazione griglia dati. Se desideri che gli utenti possano modifi care le informazioni e memorizzare tali modifi che nel database cui è connesso il programma, è necessario mantenere questa impostazione predefi nita. Al contrario, per disabilitare la possibilità di eseguire modifi che è necessario impostare la proprietà ReadOnly su True.

Nel caso in esame viene mantenuta l’impostazione predefi nita False, poiché si desidera verifi care 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 verifi care 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 modifi ca, 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:

Abilitazione delle modifi che in un database

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 modifi ca 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 modifi cato 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 modifi che in tutte le tabelle aperte in un programma, ossia salva le modifi che non solo della tabella Faculty, ma anche delle altre tabelle aperte. In questo caso non è obbligatorio accettare il comportamento di salvataggio predefi nito. Se desideri salvare solo le modifi che 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 modifi che 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 verifi care che la tabella Faculty del database Faculty2010.accdb sia stata modifi cata. 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 modifi ca 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 verifi ca cosa accade quando tenti di modifi care il database (non sarà possibile fare o salvare modifi che). Puoi anche provare ad aggiungere nuove righe di dati al database utilizzando le funzioni di modifi ca 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 fi nora 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 FormsLe 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 fi ne 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 19Obiettivo Azione

Defi nizione di una connessio-ne con le tabelle di un data-base in un progetto

Utilizza la Confi gurazione guidata origine dati per collegare il progetto a un database, crea un dataset e popola la fi nestra 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 fi nestra Origini dati al form. Fatto ciò, ridimensiona l’oggetto visualizzazione griglia dati in modo da rendere visibili tutte le colonne presenti.

Visualizzazione dell’anteprima dei dati associati a un ogget-to visualizzazione griglia dati

Fai clic sulla freccia dell’oggetto visualizzazione griglia dati per visualizzare l’elenco Attività di DataGridView. Fai clic sul comando Anteprima dati, quindi sul pulsante Anteprima nella fi nestra 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 Modifi ca colonne, quindi sulla colonna da rimuovere nella casella Colonne selezionate e infi -ne sul pulsante Rimuovi.

Obiettivo Azione

Capitolo 19 Presentazione dei dati mediante il controllo DataGridView 489

Obiettivo Azione

Ordinamento dei record nell'oggetto visualizzazione griglia dati in fase di esecu-zione

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 visualiz-zazione griglia dati in fase di esecuzione

Fai nuovamente clic sull’intestazione della colonna per invertire l’ordina-mento (da A–Z a Z–A).

Modifi ca della larghezza predefi nita di una colonna in un oggetto visualizzazione griglia dati

Nella fi nestra Proprietà, fai clic sulla proprietà Columns, quindi sul pulsante con i puntini di sospensione. Nella fi nestra di dialogo Modifi ca colonne, imposta il valore desiderato per la proprietà Width.

Come nascondere le intesta-zioni di colonna in un ogget-to 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 fi nestra di dialogo Generatore CellStyle, imposta un colore a piacimento nella proprietà BackColor. Il colore selezionato verrà usato in alternanza con il bianco.

Modifi ca il colore delle righe della griglia in un oggetto visualizzazione griglia dati.

Imposta la proprietà GridColor.

Aggiunta di un secondo oggetto visualizzazione gri-glia dati a un form

Trascina una seconda tabella dalla fi nestra 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 modifi care i dati visualizzati in un oggetto visualizzazione griglia dati

Imposta la proprietà ReadOnly dell'oggetto visualizzazione griglia dati su True.

Scrittura delle modifi che fatte nell'oggetto visualizzazione griglia dati nel database sottostante

Verifi ca 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 modi-fi che e aggiornare il database. In alternativa, puoi utilizzare nel codice i metodi Update o Me.TableAdapterManager.UpdateAll.

Obiettivo Azione

491

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 fi nestre 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 modifi care 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 verifi care 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.NETASP.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

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 defi nite 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, è suffi ciente 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 fi le 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 fi le .aspx, anche se solitamente il codice della pagina Web Form si trova in un fi le .aspx, mentre il fi le del codice di base è ubicato in un fi le .aspx.vb.

Oltre alle pagine Web, i siti Web possono contenere moduli di codice (fi le .vb), pagine HTML (fi le .htm), informazioni di confi gurazione (fi le Web.confi g), informazioni su applicazioni Web globali (fi le Global.asax), informazioni CSS (Cascading Style Sheet), fi le 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 effi ciente.

Capitolo 20 Creazione di siti e pagine Web con Visual Web Developer e ASP.NET 493

Confronto tra pagine Web e Windows FormQuali 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 fi nestra 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 prefi sso “asp” nell’etichetta. I controlli HTML ubicati nella scheda HTML della Casella degli strumenti di Visual Web Developer, sono per impostazione predefi nita 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’effi cienza delle applicazioni Web e di aggiungere elementi complessi all’interfaccia utente.

Controlli serverI 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 HTMLI 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 DeveloperIl 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 verifi cando che Visual Studio sia confi gurato 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.NETPrima di poter creare il primo sito Web ASP.NET, è necessario assicurarsi che il computer sia confi gurato 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 confi gurato 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 confi gurazione di un server Web con IIS (Internet Information Services) e .NET Framework. Disporre di una server Web locale semplifi ca 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 (fi le 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 fi le system locale, tutti i fi le vengono memorizzati in un’unica posizione. Al termine delle prove di funzionamento dell’applicazione, è possibile distribuire i fi le 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 fi nestra di dialogo Nuovo sito Web simile a quella mostrata nell’immagine che segue:

In questa fi nestra di dialogo è possibile selezionare il modello di sito Web o applicazione, l’ubicazione del sito Web (fi le system locale, server HTTP o sito FTP) e il linguaggio di programmazione che si desidera usare (Visual Basic o Visual C#). È possibile anche identifi care 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 specifi ca di .NET Framework.)

2. Nella fi nestra di dialogo Nuovo sito Web, verifi ca 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 fi le.

Creazione di un nuovo sito Web

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 specifi cato dopo aver creato il progetto, in Visual Web Developer si fa subito. Il prefi sso “my” nel nome del percorso consente di evitare eventuali confl itti con il sito Web fornito con i fi le 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 fi le 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 fi nestra (Progettazione, Dividi e Origine) che consentono di modifi care 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 fi nestra 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 defi nire 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 modifi care 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 fi le di progetto per il sito Web in fase di creazione. In particolare, nota il fi le Default.aspx in Esplora soluzioni, il quale contiene il codice dell’interfaccia utente per la pagina Web attiva. Nidifi cato nel fi le Dafult.aspx, troverai il fi le Default.aspx.vb, un fi le di confi gurazione chiamato Web.confi g e un fi le 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 DesignerA 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, modifi carlo e quindi eseguire alcune modifi che 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 predefi nita.

2. Posiziona il mouse alla fi ne del testo "ASP.NET".

Alla fi ne 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:

Aggiunta di testo nella visualizzazione Progettazione

500 Parte IV Programmazione di database e per il Web

Ora puoi esaminare il codice HTML relativo al testo e alla formattazione specifi cati.

Visualizzazione del codice HTML e ASP.NET della pagina Web

1. Fai clic sulla scheda Origine nella parte inferiore della fi nestra 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 fi gura seguente: Ricorda che il tuo codice può presentare alcune differenze.

Visualizzazione del codice HTML e ASP.NET della pagina Web

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 fi le 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 fi nisce una sezione. Ad esempio, il tag <style> identifi ca l’inizio del documento, mentre il successivo tag </style> ne indica la fi ne. 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 modifi ca, pertanto è possibile utilizzare per cambiare il testo immesso mediante le normali tecniche di modifi ca del testo. Se hai familiarità con il codice HTML ed ASP.NET, puoi aggiungere ulteriori tag e conte-nuto.

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 WebA 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, Label e Button

1. Visualizza la scheda Standard della Casella degli strumenti (se non è già visibile).

2. Posiziona il punto di inserimento alla fi ne 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 predefi nita, 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 ovun-que 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 posizio-namento assoluto); tuttavia, ciò può causare comportamenti differenti a seconda del browser Web usato per visualizzare la pagina.

Utilizzo dei controlli TextBox, xx Label e Button

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 prefi sso "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 fi nestra 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 modifi cato 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

Text

lblAmount

“Loan Amount”

Label2 ID

Text

lblInterest

“Interest Rate (for example, 0.09)”

Label3 ID

Text

lblPayment

“Monthly Payment”

Button1 ID

Text

btnCalculate

“Calculate”

La pagina Web dovrebbe avere il seguente aspetto:

Oggetto Proprietà Impostazione

504 Parte IV Programmazione di database e per il Web

Creazione di routine evento per i controlli delle pagine WebPer creare routine evento predefi nite (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 confi gurazione 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 predefi nita nella pagina Web per l’oggetto btnCalculate.

Creazione della routine evento btnCalculate_Click

1. Fai doppio clic sul pulsante Calculate nella pagina Web.

Il fi le 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 fi nanziaria 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 specifi cato (txtInterest.Text), un periodo di rimborso di tre anni (36 mesi) e l’importo specifi cato (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à specifi cata nella prossima operazione.) Perché è necessario trasformare l’importo del pagamento in un numero positivo? Per impostazione predefi nita, la funzione Pmt restituisce valori negativi indicanti gli importi dovuti, ma solitamente i valori negativi hanno un aspetto

Creazione della routine evento btnCalculate_Click

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 fi le 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 fi le:

Imports System.Math

Come già discusso nel capitolo 5, per impostazione predefi nita 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 fi nestra 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:

Creazione e visualizzazione di un sito Web

506 Parte IV Programmazione di database e per il Web

La fi nestra di dialogo Debug non attivato può essere fuoviante, ma non è un problema. Visual Web Developer indica soltanto che il fi le Web.confi g del progetto correntemente non consente il debug (una funzionalità standard di protezione). Nonostante sia possibile ignorare questa fi nestra di dialogo a ogni verifi ca del funzionamento dell’applicazione in Visual Studio facendo clic sul pulsante Esegui senza debug, si consiglia di modifi care ora il fi le Web.confi g.

Suggerimento di protezione Prima di distribuire un sito Web sul campo, assicurati di disattivare la funzione di debug in Web.confi g per garantire la protezione dell’applicazione da manomissioni impreviste.

2. Fai clic su OK per modifi care il fi le Web.confi g.

Visual Studio modifi ca il fi le, 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 fi nestra di Internet Explorer, potresti visualizzare la Barra informazioni nella quale è indicato che le impostazioni intranet sono disabilitate per impostazione predefi nita. 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ù que-sto 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 infi ne su Intranet locale. Fai clic sul pulsante Siti e deseleziona la casella di controllo accanto a Rileva automaticamente rete Intranet nella fi nestra 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 fi nanziamento 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 verifi ca 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 fi le .aspx e ogni eventuale fi le di supporto necessario per il progetto in una directory virtuale opportunamente confi gurata 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 WebNonostante 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 specifi ca dati in un formato errato. Per rendere più affi dabili 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, fi le 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 fi le 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 fi nestra di progettazione.

Personalizzazione della pagina Web About.aspx

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 modifi che.

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 profi li 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 effi cienza. 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.

Aggiunta di una nuova pagina Web per le informazioni provenienti da un database

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 fi nestra 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 Confi gurazione 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:

Aggiunta di un controllo GridView

514 Parte IV Programmazione di database e per il Web

5. Fai clic sull’icona Access Database, digita Faculty2010 nella casella Specifi care 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 fi nestra 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, signifi ca che probabilmente non è installato Access 2007 o versione successiva In questo caso, scarica e installa Offi ce System Driver: Data Connectivity Components 2007 dal sito Microsoft.com.

Il sistema ora chiede di confi gurare 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 defi niti 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 confi gurare un dataset che rappresenta una porzione del database Facutly2010.accdb. Puoi visualizzare l'istruzione SELECT nella parte inferiore di questa fi nestra 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 specifi cate. 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 fi nestra di dialogo Formattazione automatica è simile alla seguente:

La possibilità di formattare, modifi care 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 specifi care 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 fi nestra Progettazione.

Nella fi nestra 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.

Aggiunta di un collegamento ipertestuale alla home page

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 fi nestra di dialogo Seleziona URL.

8. Fai clic sul fi le FacultyLoanLeads.aspx nella casella di riepilogo Contenuto cartella, quindi su OK.

9. Fai clic sul pulsante Salva tutto per salvare le modifi che.

Il collegamento è completo e ora è possibile procedere alla verifi ca del funzionamento del sito Web e del controllo GridView nel browser.

Test del sito Web Car Loan Calculator fi nale

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 modifi ca o aggiunta a un progetto, si consiglia di verifi care il funzionamento delle funzioni originali per controllare che non siano state alterate inavvertitamente. Lo schermo dovrebbe apparire simile all’immagine che segue.

Test del sito Web Car Loan Calculator fi nale

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 predefi nita, i dati di questa tabella non possono essere ordinati, ma è possibile modifi care 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 verifi ca del funzionamento del sito Web Car Loan Calculator, Internet Explorer mostra “Home page” nella barra del titolo e nella scheda della fi nestra. All'inizio della fi nestra, 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" modifi cando la pagina master del sito. Adesso, esegui qualche prova di modifi ca 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 fi nestra Proprietà.

Impostazione delle proprietà Title

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 predefi nita nella fi nestra 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 modifi ca non viene mostrata sullo schermo , ma Visual Web Developer la memorizza internamente. A questo punto, modifi ca il titolo dell'applicazione nella pagina master del sito.

Modifi ca del titolo della pagina master

1. Fai clic sul fi le Site.Master in Esplora soluzioni, quindi sul pulsante Visualizza fi nestra di progettazione.

Visual Studio visualizza la pagina master nella fi nestra di progettazione. La pagina master è un modello che fornisce impostazioni predefi nite per il sito Web e consente di modifi carne le caratteristiche, come aspetto, intestazioni, menu e collegamenti. Ad esempio, puoi selezionare gli smart tag associati agli elementi di menu del sito Web e modifi carli come è stato fatto nel capitolo 4.

Lo schermo sarà simile al seguente:

Modifi ca del titolo della pagina master

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 modifi che 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 sfi de 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, specifi ca 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 fi nestre.

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 infi ne fai doppio clic sul controllo nella Casella degli strumenti.

Modifi ca del nome di un oggetto in una pagina Web

Utilizza la fi nestra Proprietà per modifi care la proprietà ID dell’oggetto con un nuovo nome.

Creazione della routine evento predefi nita per un oggetto in una pagina Web

Fai doppio clic sull’oggetto per visualizzare il fi le del codice, quindi immetti il codice della routine evento per l’oggetto nell’editor di codice.

Verifi ca 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 verifi care i dati immessi.

Esecuzione e verifi ca 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 Confi gurazione guidata origine dati.)

Impostazione del titolo delle pagine Web visualizzato nella barra del titolo di Internet Explorer

Per ogni pagina Web, modifi ca la fi nestra Proprietà per impostare la proprietà Title dell’oggetto DOCUMENT.

Modifi ca di intestazione, menu e altri valori predefi niti nella pagina master

Fai clic sul fi le Site.Master in Esplora soluzioni, quindi sul pulsante Visualizza fi nestra di progettazione. Modifi ca i valori predefi niti della pagina master nella fi nestra di progettazione.

Obiettivo Azione