Procedura dettagliata: visualizzazione di dati correlati in un'applicazione aziendale di Silverlight

In questa procedura dettagliata viene creata un'applicazione aziendale di Silverlight che visualizza i dati di due tabelle correlate del database di esempio AdventureWorks.

Vengono illustrate le attività seguenti:

• Creazione di un'applicazione aziendale di Silverlight costituita da due progetti: un client Silverlight e un'applicazione Web ASP.NET.

• Modifica del nome dell'applicazione tramite la modifica di una stringa di risorsa.

• Creazione di un modello Entity Data Model basato su un file di database.

• Creazione di un servizio del dominio che espone i dati del modello Entity Data Model al client Silverlight. Per ulteriori informazioni, vedere Servizi del dominio.

• Modifica di una query nel servizio del dominio per restituire i dati correlati.

• Modifica dei metadati dei servizi del dominio per supportare il caricamento di dati correlati.

• Creazione di pagine Silverlight aggiuntive per presentare i dati agli utenti.

• Aggiunta di pulsanti alla barra di navigazione predefinita per accedere alle pagine Silverlight.

• Configurazione delle pagine Silverlight per visualizzare i dati mediante il trascinamento degli elementi dalla finestra Origini dati a Silverlight Designer.

• Aggiunta di un oggetto DataPager per spostarsi tra i record.

Prerequisiti

Per l'esecuzione di questa e di altre procedure dettagliate descritte nella documentazione di WCF RIA Services è necessario che siano installati e configurati correttamente alcuni programmi prerequisiti quali Visual Studio 2010 e Silverlight Developer Runtime e SDK, oltre a WCF RIA Services e a WCF RIA Services Toolkit. È inoltre richiesta l'installazione e la configurazione di SQL Server 2008 R2 Express with Advanced Services e l'installazione del database AdventureWorks OLTP e LT.

Le istruzioni dettagliate per soddisfare tali prerequisiti vengono fornite negli argomenti all'interno del nodo Prerequisiti per WCF RIA Services. Seguire tali istruzioni prima di continuare con questa procedura dettagliata in modo da assicurarsi che si verifichi il minor numero possibile di problemi durante l'esecuzione della procedura dettagliata di RIA Services .

In questa procedura dettagliata si presuppone che si sappia creare un'applicazione aziendale di Silverlight. La procedura per il completamento di questa attività viene descritta in Procedura dettagliata: utilizzo del modello Applicazione aziendale di Silverlight.

Creazione dell'applicazione aziendale di Silverlight

Le applicazioni aziendali di Silverlight sono soluzioni con due progetti: un'applicazione Silverlight e un'applicazione Web ASP.NET che ospita l'applicazione Silverlight. Le applicazioni aziendali di Silverlight dispongono di funzionalità incorporate. Per impostazione predefinita, dispongono della funzionalità per la registrazione del sito, la barra di navigazione, la pagina Informazioni su e la home page.

Per creare l'applicazione

1. In Visual Studio 2010 creare un nuovo progetto applicazione aziendale di Silverlight in Visual Basic o C# denominato AdventureWorksOrders. La procedura per il completamento di questa attività viene descritta in Procedura dettagliata: utilizzo del modello Applicazione aziendale di Silverlight.

   La soluzione AdventureWorksOrders viene creata con due progetti: il progetto Silverlight AdventureWorksOrders e il progetto applicazione Web AdventureWorksOrders.Web.

2. In Esplora soluzioni espandere il progetto AdventureWorksOrders.

3. Espandere la cartella Assets, quindi espandere Resources.

4. Fare doppio clic su ApplicationStrings.resx per aprire Progettazione risorse.

5. Modificare la stringa Valore della risorsa ApplicationName in Adventure Works Orders.

6. Salvare le modifiche e chiudere il file ApplicationStrings.resx.

7. Eseguire l'applicazione.

   Verrà visualizzata la home page con la finestra di progettazione predefinita che include il nome dell'applicazione aggiornato.

Creazione di un modello di dati per l'applicazione

Per gestire i dati nell'applicazione si utilizza un modello Entity Data Model.

Per creare un modello Entity Data Model

1. In Esplora soluzioni fare clic con il pulsante destro del mouse su AdventureWorksOrders.Web, scegliere Aggiungi, quindi fare clic su Nuovo elemento.

   Verrà visualizzata la finestra di dialogo Aggiungi nuovo elemento.

2. Nella categoria Dati selezionare il modello ADO.NET Entity Data Model.

3. Denominarlo AdventureWorksEDM.edmx, quindi fare clic su Aggiungi.

   Verrà aperta la Procedura guidata Entity Data Model.

4. Nella pagina Scegli contenuto Model fare clic su Genera da database, quindi su Avanti.

5. Nella pagina Scegli la connessione dati fare clic su Nuova connessione.

   Verrà visualizzata la finestra di dialogo Proprietà connessione.

6. Selezionare File di database Microsoft SQL Server per l'origine dati e specificare il percorso del file del database AdventureWorksLT.

7. Fare clic su OK.

8. Nella pagina Scegli la connessione dati fare clic su Avanti.

9. Se viene visualizzato un messaggio in cui viene chiesto se si desidera copiare il file di database nel progetto e modificare la connessione, scegliere Sì.

10. Espandere il nodo Tabelle nella pagina Seleziona oggetti di database.

11. Aggiungere i segni di spunta accanto alle tabelle SalesOrderDetail (SalesLT) e SalesOrderHeader (SalesLT).

    

12. Scegliere Fine.

    Le tabelle SalesOrderDetail e SalesOrderHeader verranno visualizzate in Entity Designer.

13. Compilare la soluzione.

    È necessario compilare la soluzione prima di aggiungere un servizio del dominio.

Creazione di un servizio del dominio

Un servizio del dominio espone al client le operazioni e le entità di dati nel modello di dati. In questa procedura viene aggiunto un servizio del dominio al progetto server.

Per creare un servizio del dominio

1. In Esplora soluzioni fare clic con il pulsante destro del mouse su AdventureWorksOrders.Web, scegliere Aggiungi, quindi fare clic su Nuovo elemento.

   Verrà visualizzata la finestra di dialogo Aggiungi nuovo elemento.

2. Nella categoria Web fare clic sul modello Classe di DomainService.

3. Assegnare il nome AdventureWorksService alla classe DomainService, quindi fare clic su Aggiungi.

   Verrà visualizzata la finestra di dialogo Aggiungi una nuova classe DomainService.

4. Selezionare le caselle di controllo Abilita modifica per entrambe le entità SalesOrderDetail e SalesOrderHeader.

   

5. Fare clic su OK.

6. Compilare la soluzione.

Modifica di una query del servizio del dominio per includere i dati correlati

Il servizio del dominio fornisce le operazioni predefinite da modificare per l'applicazione specifica. In questa procedura viene modificata la query GetSalesOrderHeaders in modo tale da restituire i record di SalesOrderDetail correlati. Per l'esecuzione dell'oggetto DataPager è inoltre necessario aggiungere un criterio di ordinamento alla query.

Per modificare una query del servizio del dominio

1. In Esplora soluzioni fare doppio clic sul file AdventureWorksService.vb o AdventureWorksService.cs.

2. Aggiornare il metodo GetSalesOrderHeaders, come mostrato nel codice seguente.

   Public Function GetSalesOrderHeaders() As IQueryable(Of SalesOrderHeader)
       Return Me.ObjectContext.SalesOrderHeaders.Include("SalesOrderDetails").OrderBy(Function(c) c.SalesOrderID)
   End Function
   

   public IQueryable<SalesOrderHeader> GetSalesOrderHeaders()
   {
       return this.ObjectContext.SalesOrderHeaders.Include("SalesOrderDetails").OrderBy(e => e.SalesOrderID);
   }
   

3. In Esplora soluzioni fare doppio clic sul file AdventureWorksService.metadata.vb o AdventureWorksService.metadata.cs.

4. Nella classe SalesOrderHeaderMetadata aggiungere un attributo Include subito prima dell'istruzione di raccolta di entità SalesOrderDetails:

   <Include()>
   Public Property SalesOrderDetails As EntityCollection(Of SalesOrderDetail)
   

   [Include]
   public EntityCollection<SalesOrderDetail> SalesOrderDetails { get; set; }
   

5. Compilare la soluzione.

Creazione di una pagina Silverlight per la visualizzazione dei dati

In questa procedura viene aggiunta una pagina Orders per visualizzare i dati delle tabelle.

Per creare una pagina Silverlight

1. In Esplora soluzioni fare clic con il pulsante destro del mouse sulla cartella Views del progetto AdventureWorksOrders e aggiungere un nuovo elemento.

2. Nella finestra di dialogo Aggiungi nuovo elemento fare clic sulla categoria Silverlight, quindi selezionare il modello Pagina Silverlight.

3. Denominarlo Orders.xaml, quindi fare clic su Aggiungi.

Aggiunta di un pulsante di navigazione alla home page

In questa procedura viene aggiunto un pulsante alla home page dell'applicazione che consente di passare alla pagina Orders.

Per creare un pulsante di navigazione

1. In Esplora soluzioni fare doppio clic su MainPage.xaml.

2. Nella visualizzazione XAML aggiungere il codice seguente dopo la riga <HyperlinkButton x:Name="Link2" ... />.

   <Rectangle x:Name="Divider3" Style="{StaticResource DividerStyle}"/>
   <HyperlinkButton x:Name="Link3" Content="Orders" Style="{StaticResource LinkStyle}" NavigateUri="/Orders" TargetName="ContentFrame"/>
   

3. Eseguire l'applicazione.

   Il pulsante Orders verrà visualizzato nella barra di navigazione.

4. Fare clic sul pulsante Orders.

   Verrà visualizzata la pagina Orders vuota.

Visualizzazione dei dati correlati nella pagina

In questa procedura vengono creati i controlli associati a dati nella pagina Orders mediante il trascinamento degli elementi dalla finestra Origini dati direttamente alla finestra di progettazione. Viene creato innanzitutto un oggetto DataGrid che visualizza le informazioni di base su un singolo ordine, ad esempio numero account, ID cliente e importo dovuto. Viene quindi creato un controllo Grid che elenca i singoli elementi presenti nell'ordine.

Per creare i controlli associati a dati

1. In Esplora soluzioni fare doppio clic su Orders.xaml.

2. Scegliere Mostra origini dati dal menu Dati.

   Verrà visualizzata la finestra Origini dati. Si noti che la finestra Origini dati già contiene le entità disponibili per l'applicazione.

3. Fare clic sul nodo SalesOrderHeader, quindi fare clic sul menu a discesa.

4. Scegliere Dettagli.

5. Dalla finestra Origini dati trascinare il nodo SalesOrderHeader nella finestra di progettazione.

   Verrà creato un oggetto Grid popolato con i controlli per i campi dati della tabella SalesOrderHeader.

   

6. Nella finestra Origini dati espandere il nodo SalesOrderHeader.

7. Fare clic sul nodo SalesOrderDetails, il nodo figlio del nodo SalesOrderHeader.

   

8. Trascinare il nodo SalesOrderDetails nella finestra di progettazione accanto ai singoli controlli degli ordini.

   Verrà creato un oggetto DataGrid popolato con i campi dati della tabella SalesOrderDetail.

   

Aggiunta della funzionalità di paging per lo spostamento tra i dati dell'ordine

In questa procedura viene aggiunta la funzionalità di paging aggiungendo un oggetto DataPager all'origine dati. DataPager.Source viene impostato sull'oggetto DomainDataSource che gestisce i dati che devono essere controllati dal pager.

[!NOTA] L'oggetto DataPager richiede che la relativa origine dati venga ordinata in modo esplicito. Questo è il motivo per cui è stata aggiunta alla query la clausola OrderBy in precedenza in questa procedura dettagliata.

Per configurare il paging dei dati

1. In Esplora soluzioni fare doppio clic su Orders.xaml.

2. Individuare il controllo DataPager nella casella degli strumenti.

3. Trascinare il controllo DataPager nella finestra di progettazione.

4. Nella finestra Origini dati fare clic sul nodo SalesOrderHeader.

5. Trascinare il nodo SalesOrderHeader sul controllo DataPager.

   In questo modo la proprietà Source del controllo DataPager verrà impostata sull'origine dati corretta.

6. Selezionare DataPager nella finestra di progettazione.

7. Nella finestra Proprietà impostare la proprietà PageSize su 1.

Test dell'applicazione

In questa procedura viene compilata ed eseguita l'applicazione per verificare che si comporti come previsto.

Per eseguire il test dell'applicazione

1. Scegliere Compila soluzione dal menu Compila.

   Verificare che la soluzione venga compilata senza errori.

2. Eseguire l'applicazione.

3. Fare clic sul pulsante Orders.

4. Fare clic sui pulsanti di navigazione nel controllo DataPager per spostarsi tra i record dell'ordine.

   Si noti che i dettagli dell'ordine correlati vengono visualizzati nell'oggetto DataGrid durante lo spostamento tra i record di intestazione dell'ordine.

   

Passaggi successivi

Dopo avere completato questa procedura dettagliata, è possibile eseguire le attività correlate seguenti:

• Modificare i record e salvare le modifiche nel database. Per ulteriori informazioni, vedere Procedura dettagliata: modifica dei dati da un servizio del dominio.

Vedere anche

Concetti

WCF RIA Services
Client Silverlight