Liaison à des données hiérarchiques
Mise à jour : novembre 2007
Les contrôles de source de données peuvent fonctionner avec des données tabulaires (données relationnelles ou basées sur des tables), des données hiérarchiques, ou les deux. Les contrôles SqlDataSource et ObjectDataSource constituent deux exemples de contrôles de source de données qui utilisent des données tabulaires. ASP.NET inclut également deux contrôles de source de données qui simplifient la liaison aux données hiérarchiques : le contrôle XmlDataSource qui utilise le code XML d'un fichier ou d'une chaîne et le contrôle SiteMapDataSource qui utilise les données de navigation de site (gérées, par défaut, comme des données XML). Les contrôles de source de données hiérarchiques sont utilisés dans les scénarios en lecture seule pour afficher des données.
Cette rubrique fournit des informations plus détaillées sur la liaison entre des contrôles liés aux données et une source de données hiérarchiques. Pour plus d'informations sur les contrôles XmlDataSource et SiteMapDataSource, consultez Vue d'ensemble du contrôle serveur Web XmlDataSource et Vue d'ensemble du contrôle serveur Web SiteMapDataSource.
Liaison d'un contrôle hiérarchique à des données XML
XML est intrinsèquement hiérarchique dans sa structure et peut être affiché dans des pages Web ASP.NET qui utilisent des contrôles liés aux données hiérarchiques tels que TreeView ou Menu. Vous pouvez créer une liaison à un contrôle de source de données hiérarchiques en affectant à la propriété DataSourceID l'ID d'un contrôle XmlDataSource ou SiteMapDataSource.
L'exemple de code suivant illustre un contrôle TreeView lié à un contrôle XmlDataSource. Les données XML sont filtrées à l'aide d'une requête XPath.
<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script >
Sub SelectRegion(sender As Object, e As EventArgs)
If RegionDropDownList.SelectedValue = "(Show All)" Then
PeopleDataSource.XPath = "/People/Person"
Else
Dim selectedValue As String = ""
Select Case RegionDropDownList.SelectedValue
Case "CA"
selectedValue = "CA"
Case "HI"
selectedValue = "HI"
Case "WA"
selectedValue = "WA"
Case Else
' Invalid value.
End Select
PeopleDataSource.XPath = "/People/Person[Address/Region='" & selectedValue & "']"
End If
PeopleTreeView.DataBind()
End Sub
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head >
<title>ASP.NET Example</title>
</head>
<body>
<form id="form1" >
<table border="0" cellpadding="3">
<tr>
<td valign="top">
<b>Select Region:</b>
<asp:DropDownList id="RegionDropDownList" AutoPostBack="True"
OnSelectedIndexChanged="SelectRegion">
<asp:ListItem Selected="True">(Show All)</asp:ListItem>
<asp:ListItem>CA</asp:ListItem>
<asp:ListItem>HI</asp:ListItem>
<asp:ListItem>WA</asp:ListItem>
</asp:DropDownList>
</td>
<td valign="top">
<asp:XmlDataSource
id="PeopleDataSource"
XPath="/People/Person"
DataFile="~/App_Data/people.xml" />
<asp:TreeView
id="PeopleTreeView"
DataSourceID="PeopleDataSource">
<DataBindings>
<asp:TreeNodeBinding DataMember="LastName" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="FirstName" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="Street" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="City" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="Region" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="ZipCode" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="Title" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="Description" TextField="#InnerText" />
</DataBindings>
</asp:TreeView>
</td>
</tr>
</table>
</form>
</body>
</html>
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script >
void SelectRegion(object sender, EventArgs e)
{
if (RegionDropDownList.SelectedValue == "(Show All)")
PeopleDataSource.XPath = "/People/Person";
else
{
string selectedValue = "";
switch (RegionDropDownList.SelectedValue)
{
case "CA":
selectedValue = "CA";
break;
case "HI":
selectedValue = "HI";
break;
case "WA":
selectedValue = "WA";
break;
default:
// Invalid value.
break;
}
PeopleDataSource.XPath = "/People/Person[Address/Region='" + selectedValue + "']";
}
PeopleTreeView.DataBind();
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head >
<title>ASP.NET Example</title>
</head>
<body>
<form id="form1" >
<table border="0" cellpadding="3">
<tr>
<td valign="top">
<b>Select Region:</b>
<asp:DropDownList id="RegionDropDownList" AutoPostBack="True"
OnSelectedIndexChanged="SelectRegion">
<asp:ListItem Selected="True">(Show All)</asp:ListItem>
<asp:ListItem>CA</asp:ListItem>
<asp:ListItem>HI</asp:ListItem>
<asp:ListItem>WA</asp:ListItem>
</asp:DropDownList>
</td>
<td valign="top">
<asp:XmlDataSource
id="PeopleDataSource"
XPath="/People/Person"
DataFile="~/App_Data/people.xml" />
<asp:TreeView
id="PeopleTreeView"
DataSourceID="PeopleDataSource">
<DataBindings>
<asp:TreeNodeBinding DataMember="LastName" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="FirstName" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="Street" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="City" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="Region" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="ZipCode" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="Title" TextField="#InnerText" />
<asp:TreeNodeBinding DataMember="Description" TextField="#InnerText" />
</DataBindings>
</asp:TreeView>
</td>
</tr>
</table>
</form>
</body>
</html>
Liaison d'un contrôle tabulaire à des données XML
Alors que le contrôle XmlDataSource est essentiellement utilisé pour exposer les données XML à des contrôles liés aux données hiérarchiques tels que les contrôles TreeView et Menu, vous pouvez également lier des contrôles liés aux données tabulaires, tels qu'un contrôle GridView ou DataList, au contrôle XmlDataSource.
Lorsque vous liez un contrôle lié aux données tabulaires au contrôle XmlDataSource, le contrôle lié aux données génère uniquement le rendu du premier niveau de la hiérarchie XML. Toutefois, dans un modèle de contrôle lié aux données, vous pouvez également utiliser les méthodes de liaison de données XPath et XPathSelect pour créer une liaison à des éléments spécifiques de la hiérarchie XML. La méthode de liaison de données XPath retourne une valeur d'un nœud ou d'un attribut, quel que soit son niveau dans la hiérarchie. La méthode XPathSelect retourne une liste de nœuds correspondant à une expression XPath, que le contrôle de données tabulaires peut utiliser comme s'il s'agissait d'une collection d'enregistrements de données.
Pour plus d'informations et d'exemples, consultez Liaison d'un contrôle sous forme de tableau au contrôle XmlDataSource.
Autres formulaires de données hiérarchiques
En plus de lier des contrôles à un contrôle XmlDataSource, comme le décrit cette rubrique, vous pouvez également lier un contrôle hiérarchique à un fichier sitemap. Pour plus d'informations, consultez Plans de sites ASP.NET. L'exemple de code suivant montre comment lier un contrôle Menu à un contrôle SiteMapDataSource.
<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<!-- For the hover styles of the Menu control to -->
<!-- work correctly, you must include this head -->
<!-- element. -->
<head >
<title>Menu DataBinding Example</title>
</head>
<body>
<form id="form1" >
<h3>Menu DataBinding Example</h3>
<!-- Bind the Menu control to a SiteMapDataSource control. -->
<asp:menu id="NavigationMenu"
disappearafter="2000"
staticdisplaylevels="2"
staticsubmenuindent="10"
orientation="Vertical"
font-names="Arial"
target="_blank"
datasourceid="MenuSource"
>
<staticmenuitemstyle backcolor="LightSteelBlue"
forecolor="Black"/>
<statichoverstyle backcolor="LightSkyBlue"/>
<dynamicmenuitemstyle backcolor="Black"
forecolor="Silver"/>
<dynamichoverstyle backcolor="LightSkyBlue"
forecolor="Black"/>
</asp:menu>
<asp:SiteMapDataSource id="MenuSource"
/>
</form>
</body>
</html>
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<!-- For the hover styles of the Menu control to -->
<!-- work correctly, you must include this head -->
<!-- element. -->
<head >
<title>Menu DataBinding Example</title>
</head>
<body>
<form id="form1" >
<h3>Menu DataBinding Example</h3>
<!-- Bind the Menu control to a SiteMapDataSource control. -->
<asp:menu id="NavigationMenu"
disappearafter="2000"
staticdisplaylevels="2"
staticsubmenuindent="10"
orientation="Vertical"
font-names="Arial"
target="_blank"
datasourceid="MenuSource"
>
<staticmenuitemstyle backcolor="LightSteelBlue"
forecolor="Black"/>
<statichoverstyle backcolor="LightSkyBlue"/>
<dynamicmenuitemstyle backcolor="Black"
forecolor="Silver"/>
<dynamichoverstyle backcolor="LightSkyBlue"
forecolor="Black"/>
</asp:menu>
<asp:SiteMapDataSource id="MenuSource"
/>
</form>
</body>
</html>
Pour créer les données de l'exemple, vous pouvez copier les données sitemap d'exemple suivantes vers un fichier de votre application Web nommé Web.sitemap.
<siteMap>
<siteMapNode url="~\Home.aspx"
title="Home"
description="Home">
<siteMapNode url="~\Music.aspx"
title="Music"
description="Music">
<siteMapNode url="~\Classical.aspx"
title="Classical"
description="Classical"/>
<siteMapNode url="~\Rock.aspx"
title="Rock"
description="Rock"/>
<siteMapNode url="~\Jazz.aspx"
title="Jazz"
description="Jazz"/>
</siteMapNode>
<siteMapNode url="~\Movies.aspx"
title="Movies"
description="Movies">
<siteMapNode url="~\Action.aspx"
title="Action"
description="Action"/>
<siteMapNode url="~\Drama.aspx"
title="Drama"
description="Drama"/>
<siteMapNode url="~\Musical.aspx"
title="Musical"
description="Musical"/>
</siteMapNode>
</siteMapNode>
</siteMap>
Voir aussi
Concepts
Vue d'ensemble du contrôle serveur Web XmlDataSource
Liaison d'un contrôle sous forme de tableau au contrôle XmlDataSource
Vue d'ensemble du contrôle serveur Web SiteMapDataSource
Vue d'ensemble des contrôles de menu