Отображение иерархических данных с помощью вложенных элементов управления Repeater и Visual C# .NET

Статья
07/17/2023

В этой статье содержатся сведения о том, как отображать иерархические данные с помощью вложенных элементов управления Repeater и Visual C# .NET.

Исходная версия продукта: Visual C#
Исходный номер базы знаний: 306154

Сводка

В этой статье описывается использование вложенных элементов управления Repeater для отображения иерархических данных. Эту концепцию можно применить к другим элементам управления со списком.

В этой статье рассматриваются следующие пространства имен библиотеки классов Microsoft платформа .NET Framework:

System.Data
System.Data.SqlClient

Привязка к родительской таблице

Запустите Visual Studio .NET.
В меню Файл выберите пункт Создать и затем пункт Проект.
Выберите Проекты Visual C# в разделе Типы проектов, а затем выберите ASP.NET веб-приложение в разделе Шаблоны.
В поле Расположение удалите WebApplication#, а затем введите NestedRepeater. Если вы используете локальный сервер, оставьте имя сервера как http://localhost. http://localhost/NestedRepeater Путь отображается в поле Расположение. Нажмите кнопку OK.
В Обозреватель решений щелкните правой кнопкой мыши узел Имя проекта NestedRepeater, наведите указатель на пункт Добавить и выберите команду Добавить веб-форму.
Чтобы присвоить имя веб-форме, введите NestedRepeater и нажмите кнопку Открыть.
Создается новая веб-форма. Он открывается в режиме конструктора в интегрированной среде разработки (IDE) Visual Studio .NET. На панели элементов выберите элемент управления Repeater и перетащите его на страницу Веб-форма.
Измените свойство ID этого элемента управления Repeater на parentRepeater.
Перейдите в представление HTML для этой веб-формы. Для этого щелкните вкладку HTML в левом нижнем углу Designer. Элемент управления Repeater создает следующий КОД HTML:
```
<asp:Repeater id="parentRepeater" runat="server"></asp:Repeater>
```

Добавьте следующий код в Repeater теги:

<itemtemplate>
    <b>
        <%# DataBinder.Eval(Container.DataItem, "au_id") %>
    </b>
    <br>
</itemtemplate>

После этого HTML-код для repeater выглядит следующим образом:

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

В Обозреватель решений щелкните правой кнопкой мыши NestedRepeater.aspx и выберите пункт Просмотреть код, чтобы переключиться на файл NestedRepeater.aspx.cs кода программной части.
Добавьте следующее объявление пространства имен в начало файла:
```
using System.Data;
using System.Data.SqlClient;
```

Добавьте следующий код в 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();
 }

Примечание.

Возможно, вам потребуется изменить строка подключения базы данных в соответствии с вашей средой.

Сохраните все файлы.
В Обозреватель решений щелкните правой кнопкой мыши NestedRepeater.aspx и выберите пункт Задать как начальную страницу.
В меню Сборка щелкните Сборка решения , чтобы скомпилировать проект.
Просмотрите страницу .aspx в браузере и убедитесь, что страница работает до сих пор. Выходные данные должны выглядеть следующим образом:
```
172-32-1176
213-46-8915
238-95-7766
267-41-2394
...
```

Привязка к дочерней таблице

В html-представлении страницы NestedRepeater.aspx найдите следующую строку кода:
```
<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.

DataSource Задайте свойство для дочернего элемента управления Repeater следующим образом:

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

После задания DataSource свойства для дочернего элемента управления 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>

Добавьте следующую директиву page в начало страницы:
```
<%@ Import Namespace="System.Data" %>
```

На странице кода программной части замените следующую строку в событии 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 в набор данных, а затем добавляются связи между Authors таблицами и Titles .

Сохраните и скомпилируйте приложение.
Просмотрите страницу в браузере и убедитесь, что страница работает до сих пор. Выходные данные должны выглядеть следующим образом:
```
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.