Bagaimana untuk menampilkan Data secara hierarki dengan menggunakan bersarang Repeater kontrol dan Visual C#.NET

Kembali ke atas

Mengikat untuk meja orangtua

1. Mulai Microsoft Visual Studio.NET.
2. Pada Berkas menu, titik Baru, lalu klik Project.
3. Klik Visual C# proyek di bawah Jenis proyek, lalu klik ASP.Aplikasi NET Web di bawah Pola acu.
4. Dalam Lokasi kotak, menghapus WebApplication#, dan kemudian ketik NestedRepeater. Jika Anda menggunakan server lokal, meninggalkan nama server sebagai http://localhost. Lintasan berikut ini muncul di Lokasi kotak:
   http://localhost/ NestedRepeater
   Klik Oke.
5. Dalam Solusi Explorer, klik kanan NestedRepeater proyek nama node, arahkan ke Tambahkan, lalu klik Tambahkan formulir Web.
6. Untuk nama formulir Web, ketikNestedRepeater, klik Terbuka.
7. Formulir Web baru dibuat. Membuka dalam Design View di Integrated Development Environment (IDE) Microsoft Visual Studio.NET. Dari Toolbox, pilih Repeater kontrol, dan kemudian tarik ke halaman formulir Web.
8. Perubahan ID properti ini Repeater kontrol untuk parentRepeater.
9. Beralih ke tampilan HTML untuk formulir Web ini. Untuk melakukannya, klik The HTML tab di sudut kiri bawah perancang. The Repeater kontrol menghasilkan kode HTML berikut:

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

10. Tambahkan kode berikut dalam Repeater Tag:

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

    Setelah Anda melakukan itu, HTML kode untuk Repeater adalah sebagai berikut:

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

11. Dalam solusi Explorer, klik kanan NestedRepeater.aspx, lalu klik Lihat kode untuk beralih ke NestedRepeater.aspx.cs kode-belakang file.
12. Tambah deklarasi namespace berikut ke atas berkas:

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

13. Tambahkan kode berikut untuk Page_Load acara untuk membuat sambungan untuk Pub database, dan kemudian untuk mengikat Penulis tabel untuk Repeater kontrol:

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

    CATATAN: Anda mungkin harus mengubah string koneksi database sebagai sesuai dengan lingkungan Anda.
    
    
14. Menyimpan semua file.
15. Dalam Solusi Explorer, klik kanan NestedRepeater.aspx, dan kemudian klik Set sebagai halaman awal.
16. Pada Bangun Klik menu Membangun solusi untuk mengkompilasi proyek.
17. Tampilkan halaman .aspx di browser, dan kemudian memastikan bahwa Halaman bekerja sejauh ini.
    
    Output akan muncul sebagai berikut:
    • 172-32-1176
    • 213-46-8915
    • 238-95-7766
    • 267-41-2394
    • ...

Kembali ke atas

Mengikat untuk meja anak

1. Dalam tampilan HTML halaman NestedRepeater.aspx, Cari baris kode berikut:

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

   Tambahkan kode berikut setelah kode ini:
   

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

   Kode baru ini menambahkan kedua Repeater kontrol untuk ItemTemplate properti dari orangtua Repeater kontrol.
2. Menetapkan DataSource properti untuk anak Repeater mengontrol sebagai berikut:

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

   Setelah Anda mengatur DataSource properti untuk anak Repeater kontrol, kode HTML untuk dua Repeater kontrol (orangtua dan anak) muncul sebagai berikut:
   

   <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. Tambahkan berikut halaman arahan ke atas halaman:

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

4. Dalam kode di belakang halaman, mengganti baris berikut di Page_Load peristiwa

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

   dengan kode berikut:

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

   Ini menambah Judul tabel untuk DataSet, dan kemudian menambahkan hubungan antara penulis dan judul tabel.
   
5. Simpan dan mengkompilasi aplikasi.
6. Melihat halaman dalam browser, dan kemudian memastikan bahwa halaman bekerja begitu jauh. Output akan muncul sebagai berikut:
   172-32-1176
   PS3333
   213-46-8915
   BU1032
   BU2075
   238-95-7766
   PC1035
   267-41-2394
   BU1111
   TC7777
   ...

Kembali ke atas

Daftar kode lengkap

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

Kembali ke atas