Verbinden von Webparts in SharePoint 2010

SharePoint-Schnellstartbanner

Erste Schritte mit Webparts in SharePoint 2010: Informationen zum Erstellen, Bereitstellen und Verbinden von zwei Webparts.

Letzte Änderung: Mittwoch, 12. Januar 2011

Gilt für: SharePoint Foundation 2010 | SharePoint Server 2010 | Visual Studio | Visual Studio 2010

Inhalt dieses Artikels
Erstellen einer Beispiel-Projektaufgabenliste in SharePoint 2010
Erstellen eines neuen leeren SharePoint-Projekts
Erstellen der Webpart-Verbindungsschnittstelle
Erstellen des Anbieterwebparts "ProviderWebPart"
Erstellen des Consumerwebparts "ConsumerWebPart"
Bereitstellen und Hinzufügen der Webparts zu einer Webparts-Seite
Verbinden der beiden Webparts
Nächste Schritte

In dieser Übung werden Sie zwei Webparts erstellen und bereitstellen. Anschließend fügen Sie sie einer Webparts-Seite hinzu und verbinden sie, sodass eine Auswahl in einem Webpart für das andere Webpart übernommen wird. Für diese Aufgabe müssen Sie die folgenden Schritte ausführen:

  • Erstellen einer Beispiel-Projektaufgabenliste in SharePoint 2010

  • Erstellen eines neuen leeren SharePoint-Projekts

  • Erstellen der Webpart-Verbindungsschnittstelle

  • Erstellen des Anbieterwebparts "ProviderWebPart"

  • Erstellen des Consumerwebparts "ConsumerWebPart"

  • Bereitstellen und Hinzufügen der Webparts zu einer Webparts-Seite

  • Verbinden der beiden Webparts

Erstellen einer Beispiel-Projektaufgabenliste in SharePoint 2010

Für diese Übung ist die weiter unten in diesem Artikel angegebene Liste Projects in der lokalen SharePoint 2010-Website erforderlich. Diese Liste sollte die in Tabelle 1 aufgeführten Felder enthalten. Führen Sie zum Erstellen dieser Liste die folgenden Schritte aus:

So erstellen Sie die Projektaufgabenliste

  1. Öffnen Sie die SharePoint 2010-Website, der Sie die Webparts hinzufügen möchten (z. B. https://localhost/sites/SampleWebPartSite), in Internet Explorer.

  2. Klicken Sie auf Websiteaktionen, klicken Sie auf Weitere Optionen, und klicken Sie anschließend auf Benutzerdefinierte Liste.

  3. Geben Sie im Feld Name die Bezeichnung Projects ein, und klicken Sie dann auf Erstellen.

  4. Klicken Sie auf der Registerkarte Listentools auf Liste, und klicken Sie in der Gruppe Ansichten verwalten auf Ansicht ändern.

  5. Deaktivieren Sie alle Optionen für Spaltenname, und wählen Sie dann die Optionen ID und Titel aus. Klicken Sie auf OK.

  6. Klicken Sie auf Neues Element hinzufügen, und fügen Sie die Informationen in der ersten Zeile (ignorieren Sie die Kopfzeile) von Tabelle 1 hinzu. Die ID-Felder werden automatisch aktualisiert.

    Titel

    Schreiben von zusätzlichem Beispielcode

    Schreiben von zusätzlichen Entwicklertools

    Beantworten von Forumsfragen

    Schreiben von Entwicklerartikeln

  7. Wiederholen Sie Schritt 6 für die restlichen Zeilen von Tabelle 1.

Erstellen eines neuen leeren SharePoint-Projekts

Für diese Aufgabe erstellen Sie ein leeres SharePoint 2010-Projekt in Microsoft Visual Studio 2010.

So erstellen Sie das SharePoint-Projekt

  1. Starten Sie Visual Studio 2010, klicken Sie auf Datei, zeigen Sie auf Neu, und klicken Sie dann auf Projekt.

  2. Klicken Sie im Abschnitt Installierte Vorlagen auf den Knoten Visual C#, klicken Sie auf SharePoint, und klicken Sie anschließend auf 2010.

  3. Klicken Sie auf die Projektvorlage Leeres SharePoint-Projekt (siehe Abbildung 1), geben Sie einen Namen (z. B. ConnectTwoWebParts) und einen Speicherort für das Projekt ein, und klicken Sie dann auf OK.

    Abbildung 1. Auswählen des Typs "Leeres SharePoint-Projekt"

    Den Typ 'Leeres SharePoint-Projekt' auswählen

  4. Wählen Sie in der Liste Welche lokale Site soll für das Debugging verwendet werden? die zu verwendende Website aus (z. B. https://localhost/SampleWebPage). Wählen Sie außerdem die Option Als Farmlösung bereitstellen aus, und klicken Sie dann auf Fertig stellen.

    Das Projekt ConnectTwoWebParts wird erstellt, und der Projektmappen-Explorer wird angezeigt.

Erstellen der Webpart-Verbindungsschnittstelle

Für diese Aufgabe erstellen Sie die Webpart-Verbindungsschnittstelle IProject, die für den Austausch von Verbindungsinformationen zwischen einem Webpartanbieter und einem Webpartconsumer verantwortlich ist.

So erstellen Sie die Webpart-Verbindungsschnittstelle

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

  2. Klicken Sie im Dialogfeld Neues Element hinzufügen auf Visual C#, klicken Sie auf Code, und wählen Sie dann unter den verfügbaren Vorlagen Schnittstelle aus.

  3. Geben Sie IProject im Feld Name ein, und klicken Sie dann auf Hinzufügen.

  4. Doppelklicken Sie im Projektmappen-Explorer auf die Datei IProject.cs.

  5. Ändern Sie die Sichtbarkeit der Schnittstelle in öffentlich, indem Sie der Schnittstellendeklaration das Schlüsselwort public als Präfix voranstellen (siehe Abbildung 2).

    Abbildung 2. Die IProject-Schnittstelle

    Die IProject-Schnittstelle

  6. Fügen Sie in der IProject-Schnittstelle den folgenden Code ein.

    int Id { get; } 
    string Name { get; }
    

Erstellen des Anbieterwebparts "ProviderWebPart"

Für diese Aufgabe erstellen Sie ein Webpart, das für eine Webpartverbindung als Anbieter fungiert.

So erstellen Sie das Anbieterwebpart "ProviderWebPart"

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

  2. Klicken Sie im Abschnitt Installierte Vorlagen auf den Knoten Visual C#, klicken Sie auf SharePoint, und klicken Sie anschließend auf 2010. Wählen Sie unter den verfügbaren Vorlagen Webpart aus.

  3. Geben Sie ProviderWebPart im Feld Name ein, und klicken Sie dann auf Hinzufügen.

    Das Anbieterwebpart wird dem Projekt hinzugefügt.

  4. Doppelklicken Sie im Projektmappen-Explorer auf ProviderWebPart.cs, um die Codedatei zu öffnen.

  5. Ersetzen Sie in der ProviderWebPart-Klassendeklaration die Klasse, von der die ProviderWebPart-Klasse erbt, indem Sie WebPart wie folgt ändern:

    Microsoft.SharePoint.WebPartPages.WebPart, IProject
    
  6. Fügen Sie den folgenden Code unmittelbar nach der öffnenden geschweiften Klammer ({) der ProviderWebPart-Klassendeklaration ein. Mit diesem Codeabschnitt wird die IProject-Webpart-Verbindungsschnittstelle implementiert, und dem Webpart wird eine lokale Variable hinzugefügt.

    DropDownList _projectPicker = null;  
    int IProject.Id 
    { 
        get { return int.Parse(_projectPicker.SelectedValue); } 
    } 
    
    string IProject.Name 
    { 
        get { return _projectPicker.SelectedItem.ToString(); } 
    }
    
  7. Fügen Sie in der CreateChildControls-Unterroutine den folgenden Code ein.

    base.CreateChildControls;
    try 
    { 
        _projectPicker = new DropDownList(); 
    
        using (SPSite spSite = new SPSite(SPContext.Current.Web.Url)) 
        using (SPWeb spWeb = spSite.OpenWeb()) 
        { 
            SPList projectsList = spWeb.Lists["Projects"]; 
    
            foreach (SPListItem project in projectsList.Items) 
            { 
                _projectPicker.Items.Add(new ListItem(project.Name, project.ID.ToString())); 
            } 
        } 
        _projectPicker.AutoPostBack = true; 
    
        this.Controls.Add(_projectPicker); 
    } 
    catch (Exception ex) 
    { 
        this.Controls.Clear(); 
        this.Controls.Add(new LiteralControl(ex.Message)); 
    }
    
  8. Fügen Sie die folgende ConnectionProvider-Eigenschaft nach der CreateChildControls-Unterroutine ein. Hiermit wird der Verbindungsanbieter-Schnittstellenpunkt für ProviderWebPart bereitgestellt.

    [ConnectionProvider("Project Name and ID")] 
    public IProject NameDoesNotMatter() 
    { 
        return this; 
    }
    
  9. Löschen Sie die RenderContents-Unterroutine, falls vorhanden.

Erstellen des Consumerwebparts "ConsumerWebPart"

Für diese Aufgabe erstellen Sie ein Webpart, das für eine Webpartverbindung als Consumer fungiert.

So erstellen Sie das Consumerwebpart "ConsumerWebPart"

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

  2. Klicken Sie im Abschnitt Installierte Vorlagen auf den Knoten Visual C#, klicken Sie auf SharePoint, und klicken Sie anschließend auf 2010. Wählen Sie unter den verfügbaren Vorlagen Webpart aus.

  3. Geben Sie ConsumerWebPart im Feld Name ein, und klicken Sie dann auf Hinzufügen.

    Das Consumerwebpart wird dem Projekt hinzugefügt.

  4. Doppelklicken Sie im Projektmappen-Explorer auf ConsumerWebPart.cs, um die Codedatei zu öffnen.

  5. Fügen Sie den folgenden Code nach der öffnenden geschweiften Klammer ({) der ConsumerWebPart-Klassendeklaration ein.

    IProject _provider = null; 
    Label _lbl = null;
    
  6. Fügen Sie in der CreateChildControls-Unterroutine den folgenden Code ein.

    base.CreateChildControls;
    try 
    { 
        _lbl = new Label(); 
    
        if (_provider != null) 
        { 
            if (_provider.Id > 0) 
            { 
                _lbl.Text = _provider.Name + " was selected."; 
            } 
            else 
            { 
                _lbl.Text = "Nothing was selected."; 
            } 
        } 
        else 
        { 
            _lbl.Text = "No Provider Web Part Connected."; 
        } 
    
        this.Controls.Add(_lbl); 
    } 
    catch (Exception ex) 
    { 
        this.Controls.Clear(); 
        this.Controls.Add(new LiteralControl(ex.Message)); 
    }
    
  7. Fügen Sie die folgende ConnectionConsumer-Eigenschaft nach der CreateChildControls-Unterroutine ein. Hiermit wird der Verbindungsconsumer-Schnittstellenpunkt für das ConsumerWebPart-Webpart bereitgestellt.

    [ConnectionConsumer("Project Name and ID")] 
    public void ThisNameDoesNotMatter(IProject providerInterface) 
    { 
        _provider = providerInterface; 
    }
    
  8. Löschen Sie die RenderContents-Unterroutine, falls vorhanden.

Bereitstellen und Hinzufügen der Webparts zu einer Webparts-Seite

Für diese Aufgabe werden Sie die Anbieter- und Consumerwebparts erstellen und bereitstellen. Anschließend fügen Sie die Webparts einer Webparts-Seite hinzu.

So stellen Sie die Webparts bereit und fügen sie einer Webparts-Seite hinzu

  1. Klicken Sie im Projektmappen-Explorer mit der rechten Maustaste auf ConnectTwoWebParts, und klicken Sie dann auf Bereitstellen.

  2. Öffnen Sie Internet Explorer, und navigieren Sie zu der Website, die Sie für das Projekt angegeben haben.

  3. Klicken Sie im Menü Websiteaktionen auf Weitere Optionen.

  4. Verschieben Sie den Fensterinhalt, und klicken Sie dann auf Webpartseite. Geben Sie SampleWebPartPage im Feld Name ein, und klicken Sie dann auf Erstellen.

    Die Webparts-Seite wird von SharePoint Foundation erstellt und im Bearbeitungsmodus geöffnet.

  5. Klicken Sie auf eine der Webpartzonen im blauen Feld.

  6. Wählen Sie Benutzerdefiniert im Feld Kategorien aus (siehe Abbildung 3), wählen Sie ConsumerWebPart aus, und klicken Sie dann auf Hinzufügen.

    Abbildung 3. Auswählen von "ConsumerWebPart"

    'ConsumerWebPart' auswählen

  7. Hiermit wird ConsumerWebPart wie in Abbildung 4 dargestellt der Seite hinzugefügt.

    Abbildung 4. "ConsumerWebPart" wird der Webpartzone hinzugefügt

    'ConsumerWebPart' wird der Webpartzone hinzugefügt

  8. Wiederholen Sie diese Schritte, um ProviderWebPart einer anderen Webpartzone hinzuzufügen. Beide Webparts werden nun wie in Abbildung 5 dargestellt auf der Seite angezeigt.

    Abbildung 5. Beide Webparts wurden der Seite hinzugefügt

    Beide Webparts wurden der Seite hinzugefügt

Verbinden der beiden Webparts

Für diese Aufgabe verbinden Sie das Anbieterwebpart mit dem Consumerwebpart.

So verbinden Sie die Webparts

  1. Für diese Aufgabe verbinden Sie das Anbieterwebpart mit dem Consumerwebpart.

  2. Zeigen Sie auf Verbindungen, zeigen Sie auf Send Project Name and ID To, und klicken Sie dann auf ConsumerWebPart.

    Der Projekttitel sollte im ConsumerWebPart-Webpart angezeigt werden.

  3. Nehmen Sie in der Anbieterwebpartliste eine andere Auswahl vor. Der geänderte Titel wird dann wie in Abbildung 6 dargestellt für die Consumerwebpartzone übernommen.

    Abbildung 6. Änderung des Anbieterwebparts wird für das Consumerwebpart übernommen

    Die Änderung am Anbieterwebpart wird dargestellt

Nächste Schritte