Webparts connectées

Dans SharePoint, connecter des webparts permet de rendre une webpart consommatrice dépendante de la valeur envoyée par la ou les webparts fournisseuses. Ce mécanisme existe sur certaines webparts de SharePoint – comme les vues de liste – et peut être implémenté sur des webparts personnalisées.

Concrètement on peut s’en servir pour créer facilement des filtres ou des interfaces de type master-detail. Pour l’exemple prenons un liste de recette que l’on aimerait filtrer par le type de recette (entrée, plat, dessert).

Les tables sont structurées comme suit :

– Recettes :

<td>
  Texte
</td>
<td>
  Grand texte
</td>
<td>
  Choix (Aucun, Entrée, Plat, Dessert)
</td>

– TypeRecette :

— Titre

Prenons une page avec 2 webparts de vue sur ces listes. Les vues sont personnalisées pour des besoins de clarté.

Editer la page, sélectionner la webpart consommatrice (Recettes), Connections, Get Filter Values From > webpart fournisseuse (TypeRecette).

Sélectionner les champs à lier, puis cliquer sur Finish :

–          Titre dans la webpart fournisseuse (TypeRecette)

–          TypeRecette dans la webpart concommatrice (Recettes)

On remarque que l’interface à changer dans la webpart fournisseuse avec une flèche bidirectionnelle sur chaque ligne. Cette flèche signale que la valeur sert de filtre. Comme vous pouvez le constater sur l’animation ci-dessous, les 2 webparts sont maintenant liées.

Ce mécanisme natif dans SharePoint est simple à mettre en place. Il est un peu lent et nécessite un rechargement de la page mais se montre intéressant. Pour peu de données et/ou un affichage plus aguicheur, il est tout à fait envisageable de faire un développement personnalisé. Pourquoi pas avec KnockoutJS pour faire disparaitre le rechargement de la page.

La possibilité de connecter des webparts par PowerShell est un plus indéniable. Le code ci-dessous devrait vous en convaincre.

#####     User's variables     #####

$webUrl = "http://sps2013"
$pageFile = "Pages/newpage.aspx"
$consumerWebpartName = "Recettes"
$providerWebpartName = "TypeRecette"
####################################

$web = Get-SPWeb $webUrl
$page = $web.GetFile($pageFile)
$wpm = $page.GetLimitedWebPartManager([System.Web.UI.WebControls.WebParts.PersonalizationScope]::Shared)
# Get webparts
$consumerWebpart = $wpm.WebParts | Where-Object {$_.Title -eq $consumerWebpartName}
$providerWebpart = $wpm.WebParts | Where-Object {$_.Title -eq $providerWebpartName}
# Get the connection point
$consumerConnection = $wpm.GetConsumerConnectionPoints($consumerWebPart)["DFWP Filter Consumer ID"];
$providerConnection = $wpm.GetProviderConnectionPoints($providerWebPart)["DFWP Row Provider ID"];
# Create transformer
$transformer = New-Object Microsoft.SharePoint.WebPartPages.SPRowToParametersTransformer
$transformer.ConsumerFieldNames = @("TypeRecette");
$transformer.ProviderFieldNames = @("Title");
# Connect webparts
$newCon = $wpm.SPConnectWebParts($providerWebpart,$providerConnection,$consumerWebpart,$consumerConnection,$transformer)
$wpm.SPWebPartConnections.Add($newCon);
$wpm.Dispose()
$web.Dispose()