Exemplarische Vorgehensweise: Anzeigen von verwandten Daten in einer Silverlight-Geschäftsanwendung

In dieser exemplarischen Vorgehensweise erstellen Sie eine Silverlight-Geschäftsanwendung, in der Daten aus zwei zugehörigen Tabellen in der AdventureWorks-Beispieldatenbank angezeigt werden.

In dieser exemplarischen Vorgehensweise werden die folgenden Aufgaben veranschaulicht:

  • Erstellen einer Silverlight-Geschäftsanwendung, die aus zwei Projekten besteht: einem Silverlight-Client und einer ASP.NET-Webanwendung

  • Ändern des Anwendungsnamens durch Ändern einer Ressourcenzeichenfolge

  • Erstellen eines Entity Data Models anhand einer Datenbankdatei

  • Erstellen eines Domänendiensts, der die Daten im Entity Data Model für den Silverlight-Client verfügbar macht (Weitere Informationen finden Sie unter Domänendienste.)

  • Ändern einer Abfrage im Domänendienst, um verknüpfte Daten zurückzugeben

  • Ändern der Domänendienstmetadaten, um das Laden verknüpfter Daten zu unterstützen

  • Erstellen zusätzlicher Silverlight-Seiten, um Daten für Benutzer anzuzeigen

  • Hinzufügen von Schaltflächen zur Standardnavigationsleiste, um auf die Silverlight-Seiten zuzugreifen

  • Konfigurieren der Silverlight-Seiten zum Anzeigen von Daten, indem Elemente vom Fenster Datenquellen in den Silverlight-Designer gezogen werden

  • Hinzufügen eines DataPager für die Navigation in Datensätzen

Erforderliche Komponenten

Für diese und die anderen exemplarischen Vorgehensweisen in der WCF RIA Services-Dokumentation müssen zusätzlich zu WCF RIA Services und dem WCF RIA Services-Toolkit mehrere erforderliche Programme installiert und korrekt konfiguriert werden, z. B. Visual Studio 2010, die Silverlight Developer-Laufzeit und das Silverlight-SDK. Zudem müssen Sie SQL Server 2008 R2 Express with Advanced Services installieren und konfigurieren und die AdventureWorks OLTP- und LT-Datenbanken installieren.

Ausführliche Anweisungen für jede dieser erforderlichen Komponenten finden Sie in den Themen unter Erforderliche Komponenten für WCF RIA Services. Folgen Sie den Anweisungen in diesen Themen, bevor Sie mit dieser exemplarischen Vorgehensweise fortfahren, um sicherzustellen, dass beim Ausführen der exemplarischen Vorgehensweisen für RIA Services so wenig Probleme wie möglich auftreten.

Diese exemplarische Vorgehensweise setzt voraus, dass Sie eine Silverlight-Geschäftsanwendung erstellen können. Das Verfahren zum Ausführen dieser Aufgabe wird unter Exemplarische Vorgehensweise: Verwenden der Silverlight-Geschäftsanwendungsvorlage beschrieben.

Erstellen der Silverlight-Geschäftsanwendung

Bei einer Silverlight-Geschäftsanwendung handelt es sich um eine Projektmappe mit zwei Projekten: eine Silverlight-Anwendung und eine ASP.NET-Webanwendung, die die Silverlight-Anwendung hostet. Silverlight-Geschäftsanwendungen verfügen über integrierte Funktionen. Standardmäßig enthalten sie eine Startseite, eine Infoseite, eine Navigationsleiste und eine Websiteregistrierungsfunktion.

So erstellen Sie die Anwendung

  1. Erstellen Sie in Visual Studio 2010 ein neues Silverlight-Geschäftsanwendungsprojekt in Visual Basic oder C# mit dem Namen AdventureWorksOrders. Das Verfahren zum Ausführen dieser Aufgabe wird unter Exemplarische Vorgehensweise: Verwenden der Silverlight-Geschäftsanwendungsvorlage beschrieben.

    Die Projektmappe "AdventureWorksOrders" wird mit zwei Projekten erstellt: ein Silverlight-Projekt "AdventureWorksOrders" und ein Webanwendungsprojekt "AdventureWorksOrders.Web".

  2. Erweitern Sie im Projektmappen-Explorer das Projekt "AdventureWorksOrders".

  3. Erweitern Sie den Ordner "Assets" und dann den Ordner "Resources".

  4. Doppelklicken Sie auf ApplicationStrings.resx, um den Ressourcen-Designer zu öffnen.

  5. Ändern Sie den Wert der ApplicationName-Ressourcenzeichenfolge in Adventure Works-Aufträge.

  6. Speichern Sie die Änderungen, und schließen Sie die Datei ApplicationStrings.resx.

  7. Führen Sie die Anwendung aus.

    Die Startseite wird geöffnet, und der Standardentwurf mit dem aktualisierten Anwendungsnamen wird angezeigt.

Erstellen eines Datenmodells für die Anwendung

Die Daten in der Anwendung werden mithilfe eines Entity Data Models verwaltet.

So erstellen Sie ein Entity Data Model

  1. Klicken Sie im Projektmappen-Explorer mit der rechten Maustaste auf "AdventureWorksOrders.Web", klicken Sie auf Hinzufügen und dann auf Neues Element.

    Das Dialogfeld Neues Element hinzufügen wird angezeigt.

  2. Klicken Sie in der Kategorie Daten auf die Vorlage ADO.NET Entity Data Model.

  3. Ändern Sie den Namen in AdventureWorksEDM.edmx, und klicken Sie dann auf Hinzufügen.

    Der Assistent für Entity Data Model wird geöffnet.

  4. Klicken Sie auf der Seite Modellinhalte auswählen auf Aus Datenbank generieren und dann auf Weiter.

  5. Klicken Sie auf der Seite Wählen Sie Ihre Datenverbindung aus auf Neue Verbindung.

    Das Dialogfeld Verbindungseigenschaften wird angezeigt.

  6. Wählen Sie für die Datenquelle "Microsoft SQL Server-Datenbankdatei" aus, und geben Sie den Speicherort der AdventureWorksLT-Datenbankdatei an.

  7. Klicken Sie auf OK.

  8. Klicken Sie auf der Seite Wählen Sie Ihre Datenverbindung aus auf Weiter.

  9. Klicken Sie auf Ja, wenn Sie gefragt werden, ob Sie die Datenbankdatei in Ihr Projekt kopieren und die Verbindung ändern möchten.

  10. Erweitern Sie auf der Seite Wählen Sie Ihre Datenbankobjekte aus den Knoten Tabellen.

  11. Fügen Sie Häkchen neben den Tabellen SalesOrderDetail (SalesLT) und SalesOrderHeader (SalesLT) hinzu.

    RIARelatedData03ChooseDatabaseObjects

  12. Klicken Sie auf Fertig stellen.

    Die Tabellen "SalesOrderDetail" und "SalesOrderHeader" werden im Entity Designer angezeigt.

  13. Erstellen Sie die Projektmappe.

    Die Projektmappe muss vor dem Hinzufügen eines Domänendiensts erstellt werden.

Erstellen eines Domänendiensts

Ein Domänendienst macht die Datenentitäten und -vorgänge im Datenmodell für den Client verfügbar. In diesem Verfahren fügen Sie dem Serverprojekt einen Domänendienst hinzu.

So erstellen Sie einen Domänendienst

  1. Klicken Sie im Projektmappen-Explorer mit der rechten Maustaste auf "AdventureWorksOrders.Web", klicken Sie auf Hinzufügen und dann auf Neues Element.

    Das Dialogfeld Neues Element hinzufügen wird angezeigt.

  2. Klicken Sie in der Kategorie Web auf die Vorlage Domänendienstklasse.

  3. Geben Sie für die Domänendienstklasse den Namen AdventureWorksService ein, und klicken Sie dann auf Hinzufügen.

    Das Dialogfeld Neue Domänendienstklasse hinzufügen wird geöffnet.

  4. Aktivieren Sie die Kontrollkästchen Bearbeitung aktivieren für die Entitäten SalesOrderDetail und SalesOrderHeader.

    RIARelatedData04AddDomainServiceEntities

  5. Klicken Sie auf OK.

  6. Erstellen Sie die Projektmappe.

Bearbeiten einer Domänendienstabfrage, um verknüpfte Daten einzuschließen

Der Domänendienst stellt Standardvorgänge bereit, die für die spezifische Anwendung geändert werden sollten. In diesem Verfahren bearbeiten Sie die GetSalesOrderHeaders-Abfrage, sodass sie die verknüpften SalesOrderDetail-Datensätze zurückgibt. Damit der DataPager funktioniert, muss der Abfrage außerdem eine Sortierreihenfolge hinzugefügt werden.

So ändern Sie eine Domänendienstabfrage

  1. Doppelklicken Sie im Projektmappen-Explorer auf "AdventureWorksService.vb" bzw. "AdventureWorksService.cs".

  2. Aktualisieren Sie die GetSalesOrderHeaders-Methode wie im folgenden Code dargestellt.

    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. Doppelklicken Sie im Projektmappen-Explorer auf "AdventureWorksService.metadata.vb" bzw. "AdventureWorksService.metadata.cs".

  4. Fügen Sie in der SalesOrderHeaderMetadata-Klasse ein Include-Attribut direkt vor der Anweisung für die SalesOrderDetails-Entitätsauflistung hinzu:

    <Include()>
    Public Property SalesOrderDetails As EntityCollection(Of SalesOrderDetail)
    
    [Include]
    public EntityCollection<SalesOrderDetail> SalesOrderDetails { get; set; }
    
  5. Erstellen Sie die Projektmappe.

Erstellen einer Silverlight-Seite zum Anzeigen von Daten

In diesem Verfahren fügen Sie eine Seite "Orders" hinzu, um Daten aus den Tabellen anzuzeigen.

So erstellen Sie eine Silverlight-Seite

  1. Klicken Sie im Projektmappen-Explorer in "AdventureWorksOrders" mit der rechten Maustaste auf den Ordner Views, und fügen Sie ein neues Element hinzu.

  2. Klicken Sie im Dialogfeld Neues Element hinzufügen auf die Kategorie Silverlight und dann auf die Vorlage Silverlight-Seite.

  3. Ändern Sie den Namen in Orders.xaml, und klicken Sie anschließend auf Hinzufügen.

Hinzufügen einer Navigationsschaltfläche zur Startseite

In diesem Verfahren fügen Sie der Startseite der Anwendung eine Schaltfläche hinzu, die zur Seite "Orders" navigiert.

So erstellen Sie eine Navigationsschaltfläche

  1. Doppelklicken Sie im Projektmappen-Explorer auf "MainPage.xaml".

  2. Fügen Sie in der XAML-Ansicht nach der Zeile <HyperlinkButton x:Name="Link2" ... /> den folgenden Code hinzu.

    <Rectangle x:Name="Divider3" Style="{StaticResource DividerStyle}"/>
    <HyperlinkButton x:Name="Link3" Content="Orders" Style="{StaticResource LinkStyle}" NavigateUri="/Orders" TargetName="ContentFrame"/>
    
  3. Führen Sie die Anwendung aus.

    Die Schaltfläche Orders sollte auf der Navigationsleiste angezeigt werden.

  4. Klicken Sie auf die Schaltfläche Orders.

    Die leere Seite "Orders" wird angezeigt.

Anzeigen von verknüpften Daten auf der Seite

In diesem Verfahren erstellen Sie datengebundene Steuerelemente auf der Seite "Orders", indem Sie Elemente vom Fenster Datenquellen direkt in den Designer ziehen. Zuerst erstellen Sie ein DataGrid, in dem grundlegende Informationen zu einem einzelnen Auftrag angezeigt werden, z. B. "Account Number", "CustomerID" und "Amount Due". Anschließend erstellen Sie ein Grid-Steuerelement, das die einzelnen Elemente in diesem Auftrag auflistet.

So erstellen Sie die datengebundenen Steuerelemente

  1. Doppelklicken Sie im Projektmappen-Explorer auf "Orders.xaml".

  2. Klicken Sie auf das Menü Daten und dann auf Datenquellen anzeigen.

    Das Fenster Datenquellen wird geöffnet. Das Fenster Datenquellen enthält bereits die für die Anwendung verfügbaren Entitäten.

  3. Klicken Sie auf den Knoten SalesOrderHeader und dann auf das Dropdownmenü.

  4. Klicken Sie auf Details.

  5. Ziehen Sie den Knoten SalesOrderHeader aus dem Fenster Datenquellen in den Designer.

    Es wird ein Grid erstellt, das mit Steuerelementen für die Datenfelder aus der Tabelle "SalesOrderHeader" aufgefüllt ist.

    RIARelatedData06SalesOrderHeaderGridOnLayout

  6. Erweitern Sie im Fenster Datenquellen den Knoten SalesOrderHeader.

  7. Klicken Sie auf den Knoten SalesOrderDetails (der untergeordnete Knoten des Knotens SalesOrderHeader).

    RIARelatedData07SalesOrderHeaderSalesOrderDetails

  8. Ziehen Sie den Knoten SalesOrderDetails in den Designer neben die einzelnen Auftragssteuerelemente.

    Es wird ein DataGrid erstellt, das mit Feldern aus der Tabelle "SalesOrderDetail" aufgefüllt ist.

    RIARelatedData08NoPagingYet

Hinzufügen von Paging für die Navigation in den Auftragsdaten

In diesem Verfahren fügen Sie Paging hinzu, indem Sie der Datenquelle einen DataPager hinzufügen. Sie legen DataPager.Source auf die DomainDataSource fest, von der vom Pager zu steuernde Daten verwaltet werden.

noteHinweis:
Der DataPager erfordert, dass die Datenquelle explizit sortiert wird. Daher wurde der Abfrage an früherer Stelle dieser exemplarischen Vorgehensweise die OrderBy-Klausel hinzugefügt.

So konfigurieren Sie das Paging der Daten

  1. Doppelklicken Sie im Projektmappen-Explorer auf "Orders.xaml".

  2. Suchen Sie in der Toolbox nach dem DataPager-Steuerelement.

  3. Ziehen Sie den DataPager in den Designer.

  4. Klicken Sie im Fenster Datenquellen auf den Knoten SalesOrderHeader.

  5. Ziehen Sie den Knoten SalesOrderHeader in den DataPager.

    Dadurch wird die Source-Eigenschaft des DataPagers auf die richtige Datenquelle festgelegt.

  6. Wählen Sie im Designer den DataPager aus.

  7. Legen Sie im Eigenschaftenfenster die PageSize-Eigenschaft auf 1 fest.

Testen der Anwendung

In diesem Verfahren überprüfen Sie, ob sich die Anwendung wie erwartet verhält, indem Sie sie erstellen und ausführen.

So testen Sie die Anwendung

  1. Klicken Sie im Menü Erstellen auf Projektmappe erstellen.

    Überprüfen Sie, ob sich die Projektmappe fehlerfrei erstellen lässt.

  2. Führen Sie die Anwendung aus.

  3. Klicken Sie auf die Schaltfläche Orders.

  4. Klicken Sie auf die Navigationsschaltflächen der DataPager-Schaltflächen, um durch die Auftragsdatensätze zu navigieren.

    Beachten Sie, dass beim Navigieren durch die Auftragskopfdatensätze die zugehörigen Auftragsdetails im DataGrid angezeigt werden.

    Vollständige Anwendung mit OrderID und Detail

Nächste Schritte

Nach Abschluss der exemplarischen Vorgehensweise sind Sie in der Lage, die folgenden zugehörigen Aufgaben auszuführen:

Siehe auch

Konzepte

WCF RIA Services
Silverlight-Clients