使用嵌套的 Repeater 控件和 Visual C# .NET 显示分层数据

本文介绍如何使用嵌套的 Repeater 控件和 Visual C# .NET 显示分层数据。

原始产品版本: Visual C#
原始 KB 数: 306154

总结

本文介绍如何使用嵌套 Repeater 控件显示分层数据。 可以将此概念应用于其他列表绑定控件。

本文介绍以下Microsoft .NET Framework 类库命名空间:

  • System.Data
  • System.Data.SqlClient

绑定到父表

  1. 启动 Visual Studio .NET。

  2. “文件” 菜单上,指向 “新建” ,然后单击 “项目”

  3. 单击“项目类型”下的“Visual C# 项目”,然后单击“模板下的“ASP.NET Web 应用程序”。

  4. “位置” 框中,删除 WebApplication#,然后键入 NestedRepeater。 如果使用本地服务器,请将服务器名称保留为 http://localhost. 路径 http://localhost/NestedRepeater 显示在 “位置” 框中。 单击“确定”。

  5. 在解决方案资源管理器中,右键单击 NestedRepeater 项目名称节点,指向“添加”,然后单击“添加 Web 窗体”。

  6. 若要命名 Web 窗体,请键入 NestedRepeater,然后单击“ 打开”。

  7. 将创建新的 Web 窗体。 它在 Visual Studio .NET 的集成开发环境(IDE)中的设计视图中打开。 从工具箱中,选择 Repeater 控件,然后将其拖动到 Web 窗体页。

  8. 将此 Repeater 控件的 ID 属性更改为 parentRepeater

  9. 切换到此 Web 窗体的 HTML 视图。 为此,请单击 设计器左下角的 HTML 选项卡。 Repeater 控件生成以下 HTML 代码:

    <asp:Repeater id="parentRepeater" runat="server"></asp:Repeater>
    
  10. Repeater 标记中添加以下代码:

    <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代码隐藏文件。

  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 控件添加到 ItemTemplate 父 Repeater 控件的属性。

  2. DataSource 如下所示设置子 Repeater 控件的属性:

    <asp:repeater ... datasource='<%# ((DataRowView)Container.DataItem).Row.GetChildRows("myrelation") %>' >
    

    设置 DataSource 子 Repeater 控件的属性后,两个 Repeater 控件(父控件和子控件)的 HTML 代码如下所示:

    <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"]);
    

    这会将Titles表添加到 DataSet,然后添加表Titles之间的关系Authors

  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);
        }
    }
}

详细信息

有关详细信息,请参阅 Repeater Web 服务器控件