ASP.NETのTreeViewにXMLをバインドする
ASP.NETのTreeViewにXMLをバインドする
サーバーコントロールにXMLデータをバインドする際は、XmlDataSourceコントロールを併用します。
例えば、次のようなXMLデータがあるとします。
また、XPathプロパティには、データ内のバインドする部分を取得するXPathを設定します。
TreeViewの方では、DataSourceIDプロパティにXmlDataSourceのIDを設定し、DataBindingsプロパティに 画面に表示する部分とクリック時にサーバーに送信される値の部分を指定します。
asp:TreeNodeBindingの指定方法は、DataMemberにはタグ名、TextFieldにはツリーの項目として表示される文字を持つ属性、 ValueFieldにはサーバーに送信する値を持つ属性といった具合です。
今回の場合では、
以上で、TreeViewにXMLデータをバインドできるようになります。
ただ、XMLが名前空間で修飾されている場合は、うまくいきません。
それについては、また後日メモしたいと思います。
例えば、次のようなXMLデータがあるとします。
<?xml version="1.0" encoding="utf-8" ?>
<data>
<WebSites>
<WebSite name="Microsoft" url="http://www.microsoft.com/japan/">
<Contents title="MSDN" url="http://www.microsoft.com/japan/msdn/" />
<Contents title="Visual Studio"
url="http://www.microsoft.com/japan/msdn/vstudio/" />
</WebSite>
<WebSite name="Google" url="http://www.microsoft.com/japan/">
<Contents title="Google Map" url="http://maps.google.co.jp/" />
<Contents title="Google Calendar" url="http://www.google.com/calendar/" />
</WebSite>
<WebSite name="Yahoo! Japan" url="http://www.yahoo.co.jp/">
<Contents title="Yahoo! Developer Network" url="http://developer.yahoo.co.jp/" />
</WebSite>
</WebSites>
</data>
これをTreeViewにバインドする場合、ASPXファイルは以下のような記述となります。
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>TreeView Example</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TreeView ID="siteTree" DataSourceID="siteDataSource" runat="server">
<DataBindings>
<asp:TreeNodeBinding DataMember="WebSite"
TextField="name" ValueField="url" />
<asp:TreeNodeBinding DataMember="Contents"
TextField="title" ValueField="url" />
</DataBindings>
</asp:TreeView>
</div>
<asp:XmlDataSource ID="siteDataSource"
DataFile="~/Data.xml"
XPath="/data/WebSites/WebSite"
runat="server"></asp:XmlDataSource>
</form>
</body>
</html>
まずXmlDataSourceの方では、DataFileプロパティにデータへのパスを設定します。また、XPathプロパティには、データ内のバインドする部分を取得するXPathを設定します。
TreeViewの方では、DataSourceIDプロパティにXmlDataSourceのIDを設定し、DataBindingsプロパティに 画面に表示する部分とクリック時にサーバーに送信される値の部分を指定します。
asp:TreeNodeBindingの指定方法は、DataMemberにはタグ名、TextFieldにはツリーの項目として表示される文字を持つ属性、 ValueFieldにはサーバーに送信する値を持つ属性といった具合です。
今回の場合では、
- WebSiteというタグの場合は、name属性を表示しurl属性をサーバーへ送信する値に設定
- Contentsというタグの場合は、name属性を表示しurl属性をサーバーへ送信する値に設定
以上で、TreeViewにXMLデータをバインドできるようになります。
ただ、XMLが名前空間で修飾されている場合は、うまくいきません。
それについては、また後日メモしたいと思います。
| 固定リンク
コメント