文章編號: 306154 - 上次校閱: 2007年3月29日 - 版次: 4.6

如何使用巢狀的 Repeater 控制項和 Visual C#.NET 顯示階層式資料

系統提示本文適用於您使用的作業系統之外的作業系統。與您不相關的文章內容已停用。

在此頁中

全部展開 | 全部摺疊

結論

本文將告訴您,如何使用巢狀的 Repeater 控制項來顯示階層式資料。您可以將此概念套用至其他清單繫結控制項。


繫結至父資料表

  1. 啟動 Microsoft Visual Studio.NET。
  2. 在 [檔案] 功能表上指向 [新增],然後按一下 [專案]。
  3. 在 [專案類型 下, 按一下 [Visual C# 專案,然後按一下 [範本] 下方的 [ASP.NET Web 應用程式
  4. 在 [位置] 方塊中,刪除 [WebApplication #,然後再輸入 NestedRepeater。如果您使用本機伺服器,將伺服器名稱保留為 http://localhost。下列的路徑會出現在 [位置] 方塊中:
    http://localhost/ NestedRepeater
    按一下 [確定]
  5. 在 [方案總管]NestedRepeater 專案名稱節點上按一下滑鼠右鍵,並指向 [新增,然後按一下 [加入 Web Form
  6. 若要命名 Web Form、 鍵入 NestedRepeater,並按一下 [開啟]
  7. 建立新的 Web Form。它會在設計檢視] 中整合式開發環境 (IDE) 的 Microsoft Visual Studio.NET 中開啟。從 [工具箱選取 Repeater] 控制項,然後將它拖曳至 Web Form 網頁。
  8. 將這個 Repeater 控制項的 [識別碼] 屬性變更為 parentRepeater
  9. 切換至 HTML 檢視對於此 Web 表單。如果要執行這項操作,按一下 [HTML] 索引標籤左下角的專案設計工具]。Repeater 控制項產生下列的 HTML 程式碼:
    <asp:Repeater id="parentRepeater" runat="server"></asp:Repeater>
    					
  10. 連發槍 標記中加入下列程式碼:
    <itemtemplate>
         <b><%# DataBinder.Eval(Container.DataItem, "au_id") %></b><br>
    </itemtemplate>
    					
    Repeater HTML 程式碼您可以完成這個動作之後是,如下所示:
    <asp:Repeater id="parentRepeater" runat="server">
    	<itemtemplate>
    	     <b><%# DataBinder.Eval(Container.DataItem, "au_id") %></b><br>	
          </itemtemplate>
    </asp:Repeater>
    					
  11. 在 [方案總管] 中 NestedRepeater.aspx,] 上按一下滑鼠右鍵,然後按一下 [檢視程式碼 以切換到 [NestedRepeater.aspx.cs 程式碼後置 (Code-Behind) 檔案。
  12. 將下列命名空間宣告加入檔案的頂端:
    using System.Data;
    using System.Data.SqlClient;
    					
  13. 將下列程式碼加入至 Page_Load 事件以建立 Pubs] 資料庫的連接,然後將 Authors 資料表繫結至 Repeater 控制項:
          public void Page_Load(object sender, EventArgs e)
          {
             //Create the connection and DataAdapter for the Authors table.
             SqlConnection cnn = new SqlConnection("server=(local);database=pubs; Integrated Security=SSPI");
             SqlDataAdapter cmd1 = new SqlDataAdapter("select * from authors",cnn);
    
             //Create and fill the DataSet.
             DataSet ds = new DataSet();
             cmd1.Fill(ds,"authors");
             //Insert code in step 4 of the next section here.
             //Bind the Authors table to the parent Repeater control, and call DataBind.
             parentRepeater.DataSource = ds.Tables["authors"];
             Page.DataBind();
    
             //Close the connection.
             cnn.Close();
           }
    					
    注意: 您可能必須修改資料庫連接字串,使之適用於您的環境。

  14. 儲存所有的檔案。
  15. 在 [方案總管],[NestedRepeater.aspx] 上按一下滑鼠右鍵,然後按一下 [設定為起始頁]。
  16. 在 [建置] 功能表上按一下 [建置方案],以編譯專案。
  17. 在瀏覽器中檢視.aspx 網頁,並確認頁面運作為止。

    輸出應該會出現,如下所示:
    • 172 32 1176
    • 213 46 8915
    • 238 95 7766
    • 267 41 2394
    • ...

繫結至子資料表

  1. 在 NestedRepeater.aspx 頁面的 [HTML] 檢視中找出下列程式碼行:
    <b><%# DataBinder.Eval(Container.DataItem, "au_id") %></b><br>
    						
    這個程式碼之後加入下列程式碼:
    <asp:repeater id="childRepeater" runat="server">
    		<itemtemplate>
    	            <%# DataBinder.Eval(Container.DataItem, "[\"title_id\"]")%><br>
    		</itemtemplate>
    </asp:repeater>
    						
    這個新的程式碼會將第二個 Repeater 控制項,加入父系 Repeater 控制項的 標記 屬性。
  2. 設定 資料來源] 屬性為子系 Repeater 控制項,如下所示:
    <asp:repeater ... datasource='<%# ((DataRowView)Container.DataItem)
          .Row.GetChildRows("myrelation") %>' >
    					
    您將 資料來源 屬性設定為子系 Repeater 控制項之後 HTML 程式碼的兩個 Repeater 控制項 (父和子系) 會以下列方式出現:
    <asp:Repeater id="parentRepeater" runat="server">
    	<itemtemplate>
    		<b>
    		 <%# DataBinder.Eval(Container.DataItem, "au_id") %>
    		</b>
    		<br>
    		<asp:repeater id="childRepeater" runat="server" 
                        datasource='<%# ((DataRowView)Container.DataItem)
          .Row.GetChildRows("myrelation") %>' >
    			<itemtemplate>
    				<%# DataBinder.Eval(Container.DataItem, "[\"title_id\"]")%><br>	
    			</itemtemplate>
    		</asp:Repeater> 
    	</itemtemplate>
    </asp:Repeater>
    					
  3. 將下列的頁面指示詞加入至頁面的頂端:
    <%@ Import Namespace="System.Data" %>
    					
  4. 在程式碼後置的網頁取代在 Page_Load 事件
    //Insert code in step 4 of the next section here.
    						
    以下列程式碼:
             //Create a second DataAdapter for the Titles table.
             SqlDataAdapter cmd2 = new SqlDataAdapter("select * from titleauthor",cnn);
             cmd2.Fill(ds,"titles");
    
             //Create the relation between the Authors and Titles tables.
             ds.Relations.Add("myrelation",
             ds.Tables["authors"].Columns["au_id"],
             ds.Tables["titles"].Columns["au_id"]);
    
    					
    This adds the Titles table to the DataSet, and then adds the relationships between the Authors and Titles tables.
  5. 儲存並編譯應用程式。
  6. 在瀏覽器中檢視網頁,並確認頁面運作為止。輸出應該會出現,如下所示:
    172 32 1176
    ps3333
    213 46 8915
    bu1032
    bu2075
    238 95 7766
    pc1035
    267 41 2394
    bu1111
    tc7777
    ...

完整的程式碼清單

Nestedrepeater.aspx

<%@ Page language="c#" Codebehind="NestedRepeater.aspx.cs" AutoEventWireup="false" Inherits="NestedRepeater.NestedRepeater" %>
<%@ Import Namespace="System.Data" %>

<html>
<body>
<form runat=server>

<!-- start parent repeater -->
<asp:repeater id="parentRepeater" runat="server">
   <itemtemplate>
      <b><%# DataBinder.Eval(Container.DataItem,"au_id") %></b><br>

      <!-- start child repeater -->
      <asp:repeater id="childRepeater" datasource='<%# ((DataRowView)Container.DataItem)
      .Row.GetChildRows("myrelation") %>' runat="server">

         <itemtemplate>
            <%# DataBinder.Eval(Container.DataItem, "[\"title_id\"]")%><br>
         </itemtemplate>
      </asp:repeater>
      <!-- end child repeater -->

   </itemtemplate>
</asp:repeater>
<!-- end parent repeater -->

</form>
</body>
</html>
				

Nestedrepeater.aspx.cs

using System;
using System.Data;
using System.Data.SqlClient;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace NestedRepeater
{
   public class NestedRepeater : System.Web.UI.Page
   {
      protected System.Web.UI.WebControls.Repeater parentRepeater;
      public NestedRepeater()
      {
         Page.Init += new System.EventHandler(Page_Init);
      }
      public void Page_Load(object sender, EventArgs e)
      {
         //Create the connection and DataAdapter for the Authors table.
         SqlConnection cnn = new SqlConnection("server=(local);database=pubs; Integrated Security=SSPI ;");
         SqlDataAdapter cmd1 = new SqlDataAdapter("select * from authors",cnn);

         //Create and fill the DataSet.
         DataSet ds = new DataSet();
         cmd1.Fill(ds,"authors");

         //Create a second DataAdapter for the Titles table.
         SqlDataAdapter cmd2 = new SqlDataAdapter("select * from titleauthor",cnn);
         cmd2.Fill(ds,"titles");

         //Create the relation bewtween the Authors and Titles tables.
         ds.Relations.Add("myrelation",
         ds.Tables["authors"].Columns["au_id"],
         ds.Tables["titles"].Columns["au_id"]);

         //Bind the Authors table to the parent Repeater control, and call DataBind.
         parentRepeater.DataSource = ds.Tables["authors"];
         Page.DataBind();

         //Close the connection.
         cnn.Close();
      }
      private void Page_Init(object sender, EventArgs e)
      {
         InitializeComponent();
      }
      private void InitializeComponent()
      {    
         this.Load += new System.EventHandler(this.Page_Load);
      }
   }
}
				

?考

如需詳細資訊請參閱 Microsoft.NET Framework 軟體開發套件 (SDK) 中的下列主題:
加入資料表之間的關聯性
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/cpguide/html/cpconaddingrelationshipbetweentwotables.asp (http://msdn.microsoft.com/library/default.asp?url=/library/en-us/cpguide/html/cpconaddingrelationshipbetweentwotables.asp)

巡覽資料表之間的關聯性
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/cpguide/html/cpconnavigatingrelationshipbetweentwotables.asp (http://msdn.microsoft.com/library/default.asp?url=/library/en-us/cpguide/html/cpconnavigatingrelationshipbetweentwotables.asp)

重複項 (Repeater) Web 伺服器控制項
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/cpgenref/html/cpconrepeaterwebservercontrol.asp (http://msdn.microsoft.com/library/default.asp?url=/library/en-us/cpgenref/html/cpconrepeaterwebservercontrol.asp)

這篇文章中的資訊適用於:
  • Microsoft ASP.NET 1.0
  • Microsoft ASP.NET 1.1
  • Microsoft Visual C# .NET 2002 Standard Edition
  • Microsoft Visual C# .NET 2003 標準版
關鍵字:?
kbmt kbdatabinding kbhowtomaster kbservercontrols KB306154 KbMtzh
機器翻譯機器翻譯
重要:本文是以 Microsoft 機器翻譯軟體翻譯而成,而非使用人工翻譯而成。Microsoft 同時提供使用者人工翻譯及機器翻譯兩個版本的文章,讓使用者可以依其使用語言使用知識庫中的所有文章。但是,機器翻譯的文章可能不盡完美。這些文章中也可能出現拼字、語意或文法上的錯誤,就像外國人在使用本國語言時可能發生的錯誤。Microsoft 不為內容的翻譯錯誤或客戶對該內容的使用所產生的任何錯誤或損害負責。Microsoft也同時將不斷地就機器翻譯軟體進行更新。
按一下這裡查看此文章的英文版本:306154? (http://support.microsoft.com/kb/306154/en-us/ )
Microsoft及(或)其供應商不就任何在本伺服器上發表的文字資料及其相關圖表資訊的恰當性作任何承諾。所有文字資料及其相關圖表均以「現狀」供應,不負任何擔保責任。Microsoft及(或)其供應商謹此聲明,不負任何對與此資訊有關之擔保責任,包括關於適售性、適用於某一特定用途、權利或不侵權的明示或默示擔保責任。Microsoft及(或)其供應商無論如何不對因或與使用本伺服器上資訊或與資訊的實行有關而引起的契約、過失或其他侵權行為之訴訟中的特別的、間接的、衍生性的損害或任何因使用而喪失所導致的之損害、資料或利潤負任何責任。