เว็บฟอร์ม ASP.NET - การควบคุมทวนสัญญาณ
ตัวควบคุม ASP.NETRepeater คือตัวควบคุมการผูกข้อมูลต้นฉบับ ส่วนนี้จะแนะนำการใช้งานของตัวควบคุม Repeater ในการดำเนินการผูกข้อมูลของ ASP.NET
ตัวควบคุม Repeater ใช้เพื่อแสดงรายการซ้ำของรายการที่ผูกไว้กับตัวควบคุม
ผูกชุดข้อมูลเข้ากับตัวควบคุม Repeater
ตัวควบคุม Repeater ใช้เพื่อแสดงรายการซ้ำของรายการที่ผูกไว้กับตัวควบคุม การควบคุมรีพีทเตอร์สามารถผูกเข้ากับตารางฐานข้อมูล ไฟล์ XML หรือรายการอื่นๆ ได้ ที่นี่ เราจะสาธิตวิธีการผูกไฟล์ XML กับตัวควบคุม Repeater
ในตัวอย่างของเรา เราจะใช้ไฟล์ XML ต่อไปนี้ ("cdcatalog.xml"):
<?xml version="1.0" encoding="ISO-8859-1"?> <catalog> <cd> <title>Empire Burlesque</title> <artist>Bob Dylan</artist> <country>สหรัฐอเมริกา</country > <company>โคลัมเบีย</company> <price>10.90</price> <year>1985</year> </cd> <cd> <title>Hide your heart</title> <artist>Bonnie Tyler</artist> <country>UK</country> <company>CBS Records</company> <price>9.90</price> <year>1988</year> </cd> <cd> <title>เพลงฮิตที่ยิ่งใหญ่ที่สุด </title> <ศิลปิน>ดอลลี่ พาร์ตัน</ศิลปิน> <country>สหรัฐอเมริกา</country> <บริษัท>อาร์ซีเอ</บริษัท> <ราคา>9.90</price> <ปี>1982</year> </cd> <cd> <title>ยังคงมีเพลงบลูส์</title> <ศิลปิน>Gary Moore</artist> <country>UK</country> <company>Virgin Records</company> <price>10.20</price> <year >1990</year> </cd> <cd> <title>Eros</title> <artist>Eros Ramazzotti</artist> <country>EU</country> <company>BMG</company> <ราคา>9.90</ราคา> <ปี>1997</ปี> </cd> </catalog>ดูไฟล์ XML นี้: cdcatalog.xml
ขั้นแรก นำเข้าเนมสเปซ "System.Data" เราต้องการเนมสเปซนี้เพื่อทำงานกับวัตถุ DataSet รวมคำสั่งต่อไปนี้ที่ด้านบนของหน้า .aspx ของคุณ:
<%@ นำเข้าเนมสเปซ = "System.Data" %>จากนั้น ให้สร้างชุดข้อมูลสำหรับไฟล์ XML และโหลดไฟล์ XML ลงในชุดข้อมูลเมื่อโหลดเพจครั้งแรก:
<script runat="server"> ย่อย Page_Load หากไม่ใช่ Page.IsPostBack จากนั้นหรี่ mycdcatalog=New DataSet mycdcatalog.ReadXml(MapPath("cdcatalog.xml")) สิ้นสุดหากสิ้นสุดย่อยจากนั้นเราสร้างตัวควบคุม Repeater ในหน้า .aspx เนื้อหาในองค์ประกอบ <HeaderTemplate> จะถูกแสดงผลก่อนและปรากฏเพียงครั้งเดียวในเอาต์พุต ในขณะที่เนื้อหาในองค์ประกอบ <ItemTemplate> จะถูกทำซ้ำสำหรับแต่ละ "บันทึก" ในชุดข้อมูล สุดท้ายนี้ เนื้อหาในองค์ประกอบ <FooterTemplate> คือ ปรากฏเพียงครั้งเดียวในเอาต์พุต:
<html> <body> <form runat="server"> <asp:Repeater id="cdcatalog" runat="server"> <HeaderTemplate> ... </HeaderTemplate> <ItemTemplate> ... </ItemTemplate> < เทมเพลตส่วนท้าย> ... </เทมเพลตส่วนท้าย> </asp:Repeater> </form> </body> </html>จากนั้นเราเพิ่มสคริปต์เพื่อสร้างชุดข้อมูลและผูกชุดข้อมูล mycdcatalog เข้ากับตัวควบคุม Repeater จากนั้นใช้แท็ก HTML เพื่อเติมตัวควบคุม Repeater และผูกรายการข้อมูลกับเซลล์ในพื้นที่ <ItemTemplate> ผ่าน <%#Container.DataItem("fieldname")%>:
ตัวอย่าง
<%@ นำเข้า Namespace="System.Data" %> <script runat="server"> ย่อย Page_Load หากไม่ใช่ Page.IsPostBack จากนั้นหรี่ mycdcatalog=ชุดข้อมูลใหม่ mycdcatalog.ReadXml(MapPath("cdcatalog.xml")) cdcatalog.DataSource =mycdcatalog cdcatalog.DataBind() สิ้นสุดถ้าสิ้นสุดย่อย </script> <html> <body> <form runat="server"> <asp:Repeater id="cdcatalog" runat="server"> <HeaderTemplate> <table> <tr> <th>ชื่อ</th> <th>ศิลปิน</th> <th>ประเทศ </th> <th>บริษัท</th> <th>ราคา</th> <th>ปี</th> </tr> </HeaderTemplate> <ItemTemplate> <tr> <td><%#Container.DataItem("title")%></td> <td><%#Container.DataItem("artist")%></td> <td><%#Container.DataItem( "ประเทศ")%></td> <td><%#Container.DataItem("บริษัท")%></td> <td><%#Container.DataItem("ราคา")%></td> <td><%#Container.DataItem("ปี")%></td> </tr> </ItemTemplate> <FooterTemplate > </table> </FooterTemplate> </asp:Repeater> </form> </body> </html>เคล็ดลับ: สำหรับความรู้เกี่ยวกับแท็ก HTML คุณสามารถดู "คู่มืออ้างอิง HTML" ของไซต์นี้ได้!
ใช้ <AlternatingItemTemplate>
คุณสามารถเพิ่มองค์ประกอบ <AlternatingItemTemplate> หลังองค์ประกอบ <ItemTemplate> เพื่ออธิบายลักษณะที่ปรากฏของแถวที่สลับกันในเอาต์พุต ในตัวอย่างด้านล่าง ทุกแถวของตารางจะแสดงด้วยพื้นหลังสีเทาอ่อน:
ตัวอย่าง
<%@ นำเข้า Namespace="System.Data" %> <script runat="server"> ย่อย Page_Load หากไม่ใช่ Page.IsPostBack จากนั้นหรี่ mycdcatalog=ชุดข้อมูลใหม่ mycdcatalog.ReadXml(MapPath("cdcatalog.xml")) cdcatalog.DataSource =mycdcatalog cdcatalog.DataBind() สิ้นสุดถ้าสิ้นสุดย่อย </script> <html> <body> <form runat="server"> <asp:Repeater id="cdcatalog" runat="server"> <HeaderTemplate> <table> <tr> <th>ชื่อ</th> <th>ศิลปิน</th> <th>ประเทศ </th> <th>บริษัท</th> <th>ราคา</th> <th>ปี</th> </tr> </HeaderTemplate> <ItemTemplate> <tr> <td><%#Container.DataItem("title")%></td> <td><%#Container.DataItem("artist")%></td> <td><%#Container.DataItem( "ประเทศ")%></td> <td><%#Container.DataItem("บริษัท")%></td> <td><%#Container.DataItem("ราคา")%></td> <td><%#Container.DataItem("ปี")%></td> </tr> </ItemTemplate> <AlternatingItemTemplate > <tr bgcolor="#e8e8e8"> <td><%#Container.DataItem("title")%></td> <td><%#Container.DataItem("ศิลปิน")%></td> <td><%#Container.DataItem("country")%></td> <td><%#Container.DataItem( "บริษัท")%></td> <td><%#Container.DataItem("price")%></td> <td><%#Container.DataItem("year")%></td> </tr> </AlternatingItemTemplate> <FooterTemplate> </table> </FooterTemplate> </asp:Repeater> </form> < /ตัว> </html>ใช้ <SeparatorTemplate>
องค์ประกอบ <SeparatorTemplate> ใช้เพื่ออธิบายตัวคั่นระหว่างแต่ละระเบียน ในตัวอย่างด้านล่าง เส้นแนวนอนจะถูกแทรกระหว่างแต่ละแถวของตาราง:
ตัวอย่าง
<%@ นำเข้า Namespace="System.Data" %> <script runat="server"> ย่อย Page_Load หากไม่ใช่ Page.IsPostBack จากนั้นหรี่ mycdcatalog=ชุดข้อมูลใหม่ mycdcatalog.ReadXml(MapPath("cdcatalog.xml")) cdcatalog.DataSource =mycdcatalog cdcatalog.DataBind() สิ้นสุดถ้าสิ้นสุดย่อย </script> <html> <body> <form runat="server"> <asp:Repeater id="cdcatalog" runat="server"> <HeaderTemplate> <table> <tr> <th>ชื่อ</th> <th>ศิลปิน</th> <th>ประเทศ </th> <th>บริษัท</th> <th>ราคา</th> <th>ปี</th> </tr> </HeaderTemplate> <ItemTemplate> <tr> <td><%#Container.DataItem("title")%></td> <td><%#Container.DataItem("artist")%></td> <td><%#Container.DataItem( "ประเทศ")%></td> <td><%#Container.DataItem("บริษัท")%></td> <td><%#Container.DataItem("ราคา")%></td> <td><%#Container.DataItem("ปี")%></td> </tr> </ItemTemplate> <SeparatorTemplate > <tr> <td colspan="6"><hr /></td> </tr> </SeparatorTemplate> <FooterTemplate> </table> </เทมเพลตส่วนท้าย> </asp:Repeater> </form> </body> </html>ข้างต้นเป็นการแนะนำการใช้ตัวควบคุม ASP.NETRepeater