TreeView 控制項

[TreeView] 控制項用於以樹狀目錄結構顯示階層式資料,例如目錄或檔案目錄。

新增 TreeView 控制項至網頁

  • 將 [TreeView] 控制項從 [工具箱] 工作窗格拖曳至網頁。

將基本格式設定配置套用至 TreeView 控制項

  1. 在 [設計] 檢視中,以滑鼠右鍵按一下 [TreeView] 控制項,然後按一下 [顯示通用控制項工作]。

    Cc295427.alert_note(zh-tw,Expression.10).gif注意事項:

    您也可以在 [設計] 檢視中按一下 [TreeView] 控制項,再按右上角的箭號 Cc295427.56557a2a-a4ef-4c47-906b-f64b8d530387(zh-tw,Expression.10).png,以顯示 [TreeView 工作] 功能表。再按一次該箭號,即可隱藏功能表。

  2. 在 [TreeView 工作] 功能表上,按一下 [自動格式設定]。

  3. 在 [自動格式設定] 對話方塊的 [選取配置] 清單中選取一項配置。該配置對 [TreeView] 控制項的效果會顯示在 [預覽] 區域中。

  4. 按一下 [確定],以套用該格式設定配置,並關閉對話方塊;或按一下 [套用],只套用格式設定配置,而不關閉對話方塊。

在設計各種 ASP.NET 控制項時,可以在 [標籤屬性] 工作窗格中設定屬性,以指定外觀及行為。如需所有 [TreeView] 控制項屬性的完整說明,請參閱 MSDN Library 中的 TreeView

TreeView 節點類型

[TreeView] 控制項由一或多個節點所組成。樹狀目錄中的每個項目都稱為節點。下表說明三種不同類型的節點。

TreeView 控制項節點類型

節點類型

描述

沒有父節點但是有一或多個子節點的節點。

父節點

有一個父節點以及一或多個子節點的節點。

分葉

沒有子節點的節點。

雖然一般的樹狀目錄只有一個根節點,[TreeView] 控制項可讓您將多個根節點新增到樹狀目錄結構。這在您要顯示項目清單而非顯示單一主根節點 (如產品類別的清單) 時很有用。

每一個節點都有 [Text] 屬性和 [Value] 屬性。[Text] 屬性的值會顯示在 [TreeView] 控制項中,而且 [Value] 屬性會用以存放關於節點的任何其他資料,例如傳遞給與節點相關聯之回傳事件的資料。

定義 TreeView 控制項的節點

  1. 在 [設計] 檢視中,以滑鼠右鍵按一下 [TreeView] 控制項,然後按一下 [顯示通用控制項工作]。

  2. 在 [TreeView 工作] 功能表上,按一下 [編輯節點]。

  3. 在 [TreeView 節點編輯器] 對話方塊中,按一下 [新增根項目] Cc295427.ceca6b3c-d5cc-48da-9bd7-fffcc486d45d(zh-tw,Expression.10).jpg 以新增項目。

  4. 在 [屬性] 區域中,設定 [Text] 與 [href] 屬性,以及要為節點設定的其他屬性。

  5. 按一下 [新增子項目] Cc295427.b6fcf26e-e12d-4faa-ad58-a448cb5d25b0(zh-tw,Expression.10).jpg,以新增其他根項目或新增子項目至所選的項目。

  6. 若您新增了數個功能表項目,則可以選取其中一項,然後按一下 [將項目在同層級節點中上移] Cc295427.21730f68-38b2-45cd-980f-5a48feb6987d(zh-tw,Expression.10).jpg、[將項目在同層級項目中下移] Cc295427.4cfe2717-2851-4922-bb52-9c38fdda20c4(zh-tw,Expression.10).jpg、[讓選取的項目成為父代的同層級項目] Cc295427.b89d598e-1bab-4ec7-a256-e769699de3e6(zh-tw,Expression.10).jpg、[讓選取的項目成為前面同層級項目的子系] Cc295427.5d22e6e0-3cd4-4f0a-bc7d-69cd895fff90(zh-tw,Expression.10).jpg 或 [移除項目] Cc295427.27e0c529-accb-4203-a5de-1deb9142cea6(zh-tw,Expression.10).jpg,以調整其順序與縮排。

您可以將 [TreeView] 控制項繫結至 XmlDataSource 控制項SiteMapDataSource 控制項。此外,在繫結資料時,您可以完全控制資料來源要填入哪些欄位。如需詳細資訊,請參閱 MSDN Library 中的將資料繫結至 TreeView Web 伺服器控制項

將 TreeView 控制項繫結至資料來源

  1. 在 [設計] 檢視中,以滑鼠右鍵按一下 [TreeView] 控制項,然後按一下 [顯示通用控制項工作]。

  2. 在 [ DropDownList 工作] 功能表中,選取 [選擇資料來源] 下拉式清單中的現有資料來源或 [<新資料來源>]。

  3. 若選擇 [<新資料來源>],將會開啟使用資料繫結控制項,設定資料來源。按一下 [應用程式要從何處取得資料] 方塊中的 [網站導覽] 或 [XML 檔],並在 [指定資料來源的識別碼] 方塊中指定資料來源的識別碼。

  4. 若選擇 [XML 檔],請在 [設定資料來源] 對話方塊的 [資料檔案] 方塊中指定 [XML 檔案],並選擇是否要指定 XML 資料來源的 XSL 轉換檔或 XPath 運算式。

  5. 按一下對話方塊和精靈中的 [確定],回到 [設計] 檢視中的控制項。

  6. 以滑鼠右鍵按一下控制項,然後按快顯功能表中的 [編輯 TreeViewItem 資料繫結]。

  7. 在 [可用的資料繫結] 清單中,選取要繫結至功能表的 XML 欄位,然後按一下 [新增]。

  8. 選取 [選取的資料繫結] 清單中的欄位,再於 [資料繫結屬性] 區域中設定屬性值。例如,若要指定功能表內所要顯示的文字,即應選擇 [TextField] 屬性下拉式清單中的 [#InnerText],以在 XML 元素的起始與結束標籤之間顯示文字。

請參閱

概念

ASP.NET 導覽控制項概觀

Menu 控制項

SiteMapPath 控制項