<asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/App_Data/CategoriesAndProducts.xml" XPath="/Categories/Category"> </asp:XmlDataSource>
WebHierarchicalDataGrid™ によって、兄弟バンドを持つ階層データにバインドすることができます。このコントロールは、個別のコンテナグリッドとして兄弟データを表示します。兄弟データと共に、親行は複数のデータアイランドを持つ場合があります。特定の行に属する固有のデータアイランドを参照するには、バンドの DataMember 名と行の RowIslands プロパティを使用するかキーをアクセサーとして使用します。
兄弟データ バンドを持つ階層データを取得する XmlDataSource にバインドする方法を学習します。このサンプルは CategoriesAndProducts.xml ファイルを使用します。
ASP.NET Web ページを作成します。
ツールボックスからページに ScriptManager コンポーネントをドラッグします。
ツールボックスからページに WebHierarchicalDataGrid コントロールをドラッグします。
ツールボックスから XmlDataSource コントロールをページにドラッグします。
CategoriesAndProducts.xml データ ファイルを使用し、Categories データを取得するようにデータ パスを設定するために、XmlDataSource を設定します。
HTML の場合:
<asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/App_Data/CategoriesAndProducts.xml" XPath="/Categories/Category"> </asp:XmlDataSource>
WebHierarchicalDataGrid の DataSourceID プロパティを XmlDataSource コントロールの ID である "XmlDataSource1" に設定します。
ルート バンドの列スキーマを設定します。
HTML の場合:
<ig:WebHierarchicalDataGrid ID="WebHierarchicalDataGrid1" runat="server"
AutoGenerateBands=" AutoGenerateColumns="
DataSourceID="XmlDataSource1" DefaultColumnWidth="" Key="Category" DataKeyFields="CategoryID">
<%-- Categories データの列を定義します --%>
<Columns>
<ig:BoundDataField DataFieldName="CategoryID" Key="CategoryID" Header-Text="CategoryID" />
<ig:BoundDataField DataFieldName="CategoryName" Key="CategoryName" Header-Text="Category Name" />
<ig:BoundDataField DataFieldName="Description" Key="Description" Header-Text="Description" />
</Columns>
<%--行うこと:兄弟バンドを定義します --%>
</ig:WebHierarchicalDataGrid>
兄弟バンドを定義します。
HTML の場合:
<Bands>
<%-- 兄弟バンド 1 --%>
<ig:Band AutoGenerateColumns=" DataMember="Product" DataKeyFields="ProductID">
<Columns>
<ig:BoundDataField DataFieldName="ProductID" Key="ProductID" Header-Text="ProductID" />
<ig:BoundDataField DataFieldName="ProductName" Key="ProductName" Header-Text="Name" />
<ig:BoundDataField DataFieldName="QuantityPerUnit" Key="QuantityPerUnit" Header-Text="Quantity Per Unit" />
<ig:BoundDataField DataFieldName="UnitPrice" Key="UnitPrice" Header-Text="Unit Price" />
</Columns>
</ig:Band>
</Bands>
アプリケーションを実行します。WebHierarchicalDataGrid はネストされた兄弟行を持つ親行を表示します。