Como apresentar dados hierárquica utilizando controlos de repetidor aninhada e Visual C# .NET

Voltar ao topo

Ligar a tabela principal

1. Inicie o Microsoft Visual Studio NET..
2. No menu ficheiro , aponte para Novo e, em seguida, clique em projecto .
3. Clique em Visual C# Projects em Project Types e, em seguida, clique em ASP.NET Web Application em modelos .
4. Na caixa localização , elimine o WebApplication # e, em seguida, escreva NestedRepeater . Se utilizar o servidor local, deixe o nome do servidor como http://localhost . Aparece o seguinte caminho na caixa localização :
   http://localhost/ NestedRepeater
   Clique em OK .
5. No Solution Explorer , clique com o botão direito do rato no nó de nome de projecto NestedRepeater , aponte para Adicionar e, em seguida, clique em Adicionar formulário de Web .
6. Nome do formulário da Web, escreva NestedRepeater e clique em Abrir .
7. O novo formulário de Web é criado. É aberto na vista de estrutura no IDE (Integrated Development Environment) do Microsoft Visual Studio .NET. Da caixa de ferramentas, seleccione o controlo de Repetidor e, em seguida, arraste-o à página de formulário Web.
8. Altere a propriedade ID deste controlo Repetidor para parentRepeater .
9. Mude para a vista HTML para este formulário Web. Para o fazer, clique no separador HTML no canto inferior esquerdo do Designer. O controlo de Repetidor gera o seguinte código HTML:

   <asp:Repeater id="parentRepeater" runat="server"></asp:Repeater>
   					

10. Adicione o seguinte código os códigos de Repetidor :

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

    depois de efectuar, o código HTML Repetidor é o seguinte:

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

11. No Solution Explorer, clique com o botão direito do rato NestedRepeater.aspx e, em seguida, clique em Ver código para mudar para o ficheiro de código NestedRepeater.aspx.cs.
12. Adicione a seguinte declaração de espaço de nomes na parte superior do ficheiro:

    using System.Data;
    using System.Data.SqlClient;
    					

13. Adicione o seguinte código ao evento Page_Load para criar uma ligação à base de dados pubs e, em seguida, vincular à tabela autores ao controlo de Repetidor :

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

    Nota : poderá ter de modificar a cadeia de ligação da base de dados conforme apropriado para o ambiente.
    
    
14. Guarde todos os ficheiros.
15. No Solution Explorer , clique com o botão direito do rato a NestedRepeater.aspx e, em seguida, clique em Definir como página inicial .
16. No menu criar , clique em Criar soluções para compilar o projecto.
17. Visualizar a página .aspx no browser e, em seguida, verifique se a página funciona até ao momento.
    
    A saída deverá aparecer da seguinte forma:
    • 172-32-1176
    • 213-46-8915
    • 238-95-7766
    • 267-41-2394
    • ...

Voltar ao topo

Ligar a tabela subordinada

1. Na vista de HTML da página NestedRepeater.aspx, localize a seguinte linha de código:

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

   adicione o seguinte código depois deste código:
   

   <asp:repeater id="childRepeater" runat="server">
   		<itemtemplate>
   	            <%# DataBinder.Eval(Container.DataItem, "[\"title_id\"]")%><br>
   		</itemtemplate>
   </asp:repeater>
   						

   Este código novo adiciona um segundo controlo Repetidor à propriedade ItemTemplate do controlo de Repetidor principal.
2. Defina a propriedade de origem de dados do subordinado Repetidor de controlo da seguinte forma:

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

   depois de definir a propriedade de origem de dados do subordinado Repetidor de controlo, o código HTML para os dois controlos de Repetidor (principal e subordinado) é apresentado da seguinte forma:
   

   <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. Adicione a seguinte directiva de página no início da página:

   <%@ Import Namespace="System.Data" %>
   					

4. Na página de código, substitua a seguinte linha no evento Page_Load

   //Insert code in step 4 of the next section here.
   						

   com o seguinte código:

            //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. Guarde e compilar a aplicação.
6. Visualizar a página no browser e verifique se a página funciona até ao momento. A saída deverá aparecer da seguinte forma:
   172-32-1176
   PS3333
   213-46-8915
   BU1032
   BU2075
   238-95-7766
   PC1035
   267-41-2394
   BU1111
   TC7777
   ...

Voltar ao topo

Concluir lista de código

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

Voltar ao topo