Procedura dettagliata: visualizzazione di dati tramite una stored procedure nel controllo server Web GridView

Aggiornamento: novembre 2007

In questa procedura dettagliata viene illustrato come visualizzare dati nel controllo GridView tramite una stored procedure. Le stored procedure sono query SQL memorizzate in un database Microsoft SQL Server anziché nel codice di applicazione. Di conseguenza, sono più sicure del codice di query e spesso consentono un'esecuzione più rapida. In questa procedura dettagliata si creerà un controllo SqlDataSource che recupera i risultati di una stored procedure. Il controllo SqlDataSource funge da origine dati per un controllo GridView. Il controllo GridView legge i risultati generati dalla stored procedure e crea le righe e le tabelle necessarie alla visualizzazione dei dati.

In particolare, vengono illustrate le seguenti operazioni:

• Connessione a un database SQL Server in Visual Web Developer.

• Utilizzo del controllo SqlDataSource per gestire l'accesso e l'associazione ai dati.

• Aggiunta di una stored procedure per restituire i dati da visualizzare nel controllo GridView.

• Visualizzazione dei dati restituiti dalla stored procedure nel controllo GridView.

Prerequisiti

Per completare questa procedura dettagliata è necessario:

• Visual Studio 2008°o°Visual Web Developer 2008 Express Edition.

  Nota:
  La funzionalità Aggiungi nuova stored procedure utilizzata in questa procedura dettagliata non è supportata in Visual Web Developer 2005 Express Edition.

• SQL Server Express Edition. Se è stato installato SQL Server, è possibile utilizzare questo programma, ma sarà necessario apportare piccole modifiche ad alcune procedure.

• Microsoft Data Access Components (MDAC) 2.7 o versione successiva.

  MDAC 2.7 è già disponibile in Microsoft Windows XP o Windows Server 2003. Tuttavia, se si utilizza Microsoft Windows 2000, può essere necessario aggiornare la versione di MDAC già installata nel computer. Per ulteriori informazioni, vedere l'articolo Microsoft Data Access Components (MDAC) Installation nel sito Web MSDN (informazioni in lingua inglese).

• Accesso al database Northwind di SQL Server. Per informazioni su come scaricare e installare il database di esempio Northwind SQL Server, vedere Installazione dei database di esempio nel sito Web di Microsoft SQL Server.

  Nota:
  Per ulteriori informazioni sulle modalità di accesso a SQL Server, contattare l'amministratore del server.

Creazione di un sito Web

Creare un sito e una pagina Web nuovi mediante la procedura indicata di seguito.

Per creare un sito Web di file system

1. AprireVisual Web Developer

2. Scegliere Nuovo dal menu File, quindi fare clic su Sito Web. In caso di utilizzo di Visual Web Developer Express Edition, scegliere Nuovosito Web dal menu File.

   Viene visualizzata la finestra di dialogo Nuovo sito Web.

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

4. Nella casella Percorso, selezionare File system; nella seconda, immettere il nome della cartella in cui salvare le pagine del sito Web.

   Ad esempio, digitare il nome della cartella C:\WebSites\StoredProcedure.

5. Nell'elenco Linguaggio scegliere il linguaggio di programmazione con cui lavorare.

6. Scegliere OK.

   Visual Web Developer Express Edition crea la cartella e una nuova pagina denominata Default.aspx.

Aggiunta di una stored procedure per la restituzione di dati

Per visualizzare i dati in una pagina Web ASP.NET, è necessario disporre degli elementi riportati di seguito.

• Connessione a un'origine dati (ad esempio, un database).

  Nella procedura riportata di seguito, verrà creata una connessione al database Northwind di SQL Server.

• Stored procedure che restituisce dati relativi alla visualizzazione.

• Controllo origine dati nella pagina per eseguire le stored procedure e gestirne i risultati.

• Controllo nella pagina per visualizzare i dati.

Nella procedura riportata di seguito, verranno visualizzati i dati in un controllo GridView. Il controllo GridView ottiene i relativi dati dal controllo SqlDataSource.

Il primo passaggio consiste nella creazione di una stored procedure.

Per creare una stored procedure per la restituzione di dati

1. In Esplora server fare clic con il pulsante destro del mouse su Connessioni dati e scegliere Aggiungi connessione. Se si utilizza Visual Web Developer Express Edition, utilizzare Esplora database.

   Viene visualizzata la finestra di dialogo Aggiungi connessione.

   • Se nell'elenco Origine dati non è visualizzato Microsoft SQL Server (SqlClient), fare clic su Cambia e selezionare Microsoft SQL Server nella finestra di dialogo Modifica origine dati.

   • Se invece della finestra di dialogo Proprietà di connessione viene visualizzata la finestra di dialogo Scegli origine dati, selezionare il tipo di origine dati da utilizzare nell'elenco Origine dati. Per questa procedura dettagliata il tipo di origine dati è Microsoft SQL Server. Nell'elenco Provider di dati, fare clic su Provider di dati .NET Framework per SQL Server, quindi su Continua.

     Nota:
     Se la scheda Esplora server non è visibile in Visual Web Developer, scegliere Esplora server dal menu Visualizza. In Visual Web Developer Express Edition, scegliere Esplora database dal menu Visualizza.

2. Nella casella Aggiungi connessione, immettere il nome del server in uso in Nome server.

3. Per la sezione Accesso al server, selezionare l'opzione appropriata per accedere al database SQL Server in esecuzione (sicurezza integrata oppure password e ID specifici) e, se necessario, immettere un nome utente e una password.

4. Se è stata immessa una password, selezionare la casella di controlloSalva password.

5. Immettere Northwind in Seleziona o immetti nome di database.

6. Fare clic su Test connessione e, dopo avere verificato il funzionamento della connessione, scegliere OK.

   La nuova connessione viene creata e visualizzata in Connessioni dati all'interno di Esplora server.

7. In Esplora server, sotto Connessioni dati, espandere la connessione dati appena creata. Se si utilizza Visual Web Developer Express Edition, utilizzare Esplora database.

   La connessione dati si espande per includere connessioni figlio, ad esempio Tables, Views e Stored Procedures.

8. Fare clic con il pulsante destro del mouse su Stored Procedures, quindi scegliere Aggiungi nuova stored procedure.

   Nota:
   La funzionalità Aggiungi nuova stored procedure non è supportata in Visual Web Developer 2005 Express Edition.

9. Aggiungere il codice riportato di seguito nella nuova stored procedure, sovrascrivendo l'eventuale codice esistente.

   CREATE PROCEDURE GetEmployees
   AS
       Select EmployeeID, LastName, FirstName from Employees
   RETURN 
   

10. Chiudere la finestra e scegliere Sì per creare la stored procedure.

    Nota:
    La parola chiave CREATE viene modificata in ALTER quando la procedura viene salvata.

Aggiunta di un controllo GridView per la visualizzazione dei dati

Una volta stabilita una connessione con un'origine dati, è necessario quanto riportato di seguito:

• Un controllo origine dati nella pagina per eseguire le stored procedure e gestirne i risultati.

• Un controllo nella pagina per visualizzare i dati.

La procedura seguente prevede la visualizzazione di dati in un controllo GridView. Il controllo GridView ottiene i relativi dati dal controllo SqlDataSource.

È possibile aggiungere questi elementi al sito Web in modo separato. Tuttavia, è più semplice visualizzare i dati mediante il controllo GridView e quindi utilizzare le procedure guidate per creare la connessione e il controllo origine dati. Nella procedura seguente viene illustrato come creare gli elementi necessari per la visualizzazione dei dati nella pagina.

Per aggiungere e configurare un controllo GridView per la visualizzazione dei dati

1. Passare alla pagina Default.aspx oppure aprirla. Quindi, passare alla visualizzazione Progettazione.

2. Dal gruppo Dati della Casella degli strumenti trascinare un controllo GridView nella pagina.

3. Nell'elenco Scegli origine dati del menu Attività GridView, fare clic su Nuova origine dati.

   Verrà visualizzata la finestra di dialogo Configurazione guidata origine dati.

4. Selezionare Database e scegliere OK.

   Ciò consente di specificare che si desidera ottenere i dati da un database SQL Server.

   Nella casella Specificare un ID per l'origine dati viene visualizzato un nome di controllo origine dati predefinito, vale a dire SqlDataSource1. Lasciare inalterato questo nome.

   Nella procedura guidata Configura origine dati SqlDataSource1 viene visualizzata una pagina in cui è possibile scegliere una connessione.

5. Nell'elenco Specificare la connessione dati che deve essere utilizzata dall'applicazione per connettersi al database, immettere la connessione creata nella procedura precedente e quindi fare clic su Avanti.

   Nella procedura guidata viene visualizzata una pagina in cui è possibile scegliere di memorizzare la stringa di connessione in un file di configurazione. La memorizzazione della stringa di connessione nel file di configurazione comporta due vantaggi:

   • Maggiore sicurezza rispetto alla memorizzazione nella pagina.

   • Possibilità di utilizzare la stessa stringa di connessione in più pagine.

6. Selezionare la casella di controllo Sì, salva la connessione con nome, quindi scegliere Avanti.

   Nella procedura guidata viene visualizzata una pagina in cui è possibile specificare i dati da recuperare dal database.

7. Selezionare l'opzione Specificare una stored procedure o un'istruzione SQL personalizzata, quindi scegliere Avanti.

8. Nella pagina Definisci stored procedure o istruzioni personalizzate, selezionare Stored procedure e quindi la stored procedure creata in precedenza (GetEmployees).

9. Fare clic su Avanti.

10. Fare clic su Test query per accertarsi di recuperare i dati desiderati.

11. Scegliere Fine.

Aggiunta di un controllo DetailsView per visualizzare i dati recuperati da una stored procedure

È possibile visualizzare i dati recuperati da una stored procedure che accetta parametri. Nella procedura riportata di seguito si creerà un controllo DetailsView per visualizzare un valore calcolato per una riga selezionata di un controllo GridView. La riga GridView rappresenterà un record Employee e il controllo DetailsView mostrerà le vendite totali calcolate per il dipendente selezionato.

Occorre quanto segue:

• Una stored procedure che accetta l'ID del dipendente (EmployeeID) come parametro e restituisce un valore.

• Un secondo controllo origine dati nella pagina per eseguire la stored procedure e gestirne i risultati. Entrambi i controlli origine dati rappresenteranno connessioni allo stesso database Northwind. Si riutilizzerà la connessione al database Northwind SQL Server creata precedentemente in questa procedura dettagliata.

• Un controllo DetailsView nella pagina per visualizzare i dati.

Il primo passaggio consiste nella creazione della stored procedure.

Per creare una stored procedure per la restituzione dei dati da visualizzare nel controllo DetailsView

1. In Esplora server, sotto Connessioni dati, espandere la connessione dati creata in precedenza. Se si utilizza Visual Web Developer Express Edition, utilizzare Esplora database per eseguire questa operazione.

2. Fare clic con il pulsante destro del mouse su Stored Procedures, quindi scegliere Aggiungi nuova stored procedure.

   Nota:
   La funzionalità Aggiungi nuova stored procedure non è supportata in Visual Web Developer 2005 Express Edition.

3. Aggiungere il codice riportato di seguito nella nuova stored procedure, sovrascrivendo l'eventuale codice esistente.

   CREATE PROCEDURE EmployeeSales
   @Employee int AS
   SELECT   SUM([Order Subtotals].Subtotal) AS Total
   FROM Employees INNER JOIN
       Orders INNER JOIN
       [Order Subtotals] ON Orders.OrderID = [Order Subtotals].OrderID
   ON Employees.EmployeeID = Orders.EmployeeID
   WHERE (Employees.EmployeeID = @Employee)
   

4. Chiudere la finestra e scegliere Sì per creare la stored procedure.

   Nota:
   La parola chiave CREATE viene modificata in ALTER quando la procedura viene salvata.

Dopo aver creato la stored procedure per fornire i dati, occorre quanto segue:

• Un controllo origine dati nella pagina per eseguire le stored procedure e gestirne i risultati.

• Controllo nella pagina per visualizzare i dati.

Nella procedura riportata di seguito, verranno visualizzati i dati in un controllo DetailsView. Il controllo DetailsView ottiene i relativi dati dal controllo SqlDataSource.

È possibile aggiungere questi elementi al sito Web in modo separato. Tuttavia, è più semplice visualizzare i dati mediante il controllo DetailsView e quindi utilizzare le procedure guidate per creare la connessione e il controllo origine dati. Nella procedura seguente viene illustrato come creare gli elementi necessari per la visualizzazione dei dati nella pagina.

Il passaggio successivo consiste nell'attivare la selezione della riga per il controllo GridView. La riga selezionata determinerà il parametro EmployeeID passato alla stored procedure.

Per attivare la selezione della riga per un controllo GridView

1. Fare clic con il pulsante destro del mouse sul controllo GridView, quindi scegliere Mostra smart tag.

2. Nel riquadro Attività GridView, selezionare la casella di controllo Attiva selezione.

Il passaggio successivo consiste nel creare un controllo per visualizzare i risultati della stored procedure.

Per aggiungere e configurare un controllo DetailsView per la visualizzazione dei dati

1. Passare alla pagina Default.aspx oppure aprirla. Quindi, passare alla visualizzazione Progettazione.

2. Dal gruppo Dati della Casella degli strumenti trascinare un controllo DetailsView nella pagina.

3. Nell'elenco Scegli origine dati del menu Attività DetailsView, fare clic su Nuova origine dati.

   Verrà visualizzata la finestra di dialogo Configurazione guidata origine dati.

4. Selezionare Database e scegliere OK.

   Ciò consente di specificare che si desidera ottenere i dati da un database SQL Server.

   Nella casella Specificare un ID per l'origine dati viene visualizzato un nome di controllo origine dati predefinito, vale a dire SqlDataSource2. Lasciare inalterato questo nome.

   Nella procedura guidata Configura origine dati SqlDataSource2 viene visualizzata una pagina in cui è possibile scegliere una connessione.

5. Nell'elenco Specificare la connessione dati che deve essere utilizzata dall'applicazione per connettersi al database, immettere la connessione creata in precedenza e quindi fare clic su Avanti.

6. Selezionare l'opzione Specificare una stored procedure o un'istruzione SQL personalizzata, quindi scegliere Avanti.

7. Nella pagina Definisci stored procedure o istruzioni personalizzate, selezionare Stored procedure e quindi la stored procedure creata in precedenza (EmployeeSales).

8. Scegliere Avanti.

   Verrà visualizzata la pagina Definisci parametri.

9. Selezionare Controllo nell'elenco Origine parametro.

10. Selezionare GridView1 nell'elenco ControlID.

11. Fare clic su Test query per accertarsi di recuperare i dati desiderati. Nella finestra di dialogo Editor valori parametri, immettere il valore 1 e quindi fare clic su OK. Il valore 1 è l'ID di un dipendente contenuto nel database. Se il recupero dei dati funziona correttamente, viene restituito il valore 192107.6000. Questo valore può essere diverso se i dati del database sono stati modificati.

12. Fare clic su Fine.

Test della pagina

È ora possibile eseguire la pagina.

Per eseguire il test della pagina

1. Premere CTRL+F5 per eseguire la pagina.

   La pagina viene visualizzata nel browser. Il controllo GridView consente la visualizzazione di tutte le righe della tabella Employees.

2. Fare clic sul collegamento Seleziona di una riga di dati del controllo GridView.

   Un controllo DetailsView visualizza i dettagli della riga selezionata nonché i risultati della stored procedure relativi al calcolo delle vendite totali per il dipendente selezionato.

3. Chiudere il browser.

Passaggi successivi

In questa procedura dettagliata è stato illustrato l'utilizzo di una stored procedure di SQL Server con un controllo origine dati per visualizzare dati in una pagina Web ASP.NET. Le stored procedure possono essere utilizzate praticamente nello stesso modo in cui vengono utilizzate le istruzioni SQL quando si lavora con il controllo SqlDataSource. Le stored procedure, inoltre, possono accettare parametri associabili ai valori contenuti nella pagina Web. Di seguito sono riportati alcuni interessanti scenari basati su stored procedure che eseguono funzioni correlate ai dati mediante istruzioni SQL:

• Procedura dettagliata: creazione di pagine Web Master-Details in Visual Studio

• Procedura dettagliata: modifica e inserimento di dati nelle pagine Web con il controllo server Web DetailsView

• Procedura dettagliata: visualizzazione di un elenco a discesa durante la modifica nel controllo server Web GridView

• Utilizzo dei parametri con il controllo SqlDataSource

Vedere anche

Attività

Procedura: proteggere le stringhe di connessione durante l'utilizzo dei controlli origine dati

Procedura dettagliata: visualizzazione di un elenco a discesa durante la modifica nel controllo server Web GridView

Procedura dettagliata: accesso ai dati di base nelle pagine Web