ASP.NET Web Forms – Repeater 控制元件簡介
導讀 | 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>USA</country> <company>Columbia</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>Greatest Hits</title> <artist>Dolly Parton</artist> <country>USA</country> <company>RCA</company> <price>9.90</price> <year>1982</year> </cd> <cd> <title>Still got the blues</title> <artist>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> <price>9.90</price> <year>1997</year>< </cd> </catalog>
首先,匯入 "System.Data" 名稱空間。我們需要該名稱空間與 DataSet 物件一起工作。 把下面這條指令包含在 .aspx 頁面的頂部:
<%@ Import Namespace="System.Data" %>
接著,為 XML 檔案建立一個 DataSet,並在頁面第一次載入時把這個 XML 檔案載入 DataSet:
<script runat="server"> sub Page_Load if Not Page.IsPostBack then dim mycdcatalog=New DataSet mycdcatalog.ReadXml(MapPath("cdcatalog.xml")) end if end sub
然後我們在 .aspx 頁面中建立一個 Repeater 控制元件。<HeaderTemplate> 元素中的內容被首先呈現,並且在輸出中僅出現一次,而 <ItemTemplate> 元素中的內容會對應 DataSet 中的每條 "record" 重複出現,最後,<FooterTemplate> 元素中的內容在輸出中僅出現一次:
<html> <body> <form runat="server"> <asp:Repeater id="cdcatalog" runat="server"> <HeaderTemplate> ... </HeaderTemplate> <ItemTemplate> ... </ItemTemplate> <FooterTemplate> ... </FooterTemplate> </asp:Repeater> </form> </body> </html>
然後我們新增建立 DataSet 的
,並且繫結 mycdcatalog DataSet 到 Repeater 控制元件。然後
使用 HTML 標籤來填充 Repeater 控制元件,並通過 <%#Container.DataItem("fieldname")%> 繫結資料專案到 <ItemTemplate> 區域內的單元格中:
例項
<%@ Import Namespace="System.Data" %> <script runat="server"> sub Page_Load if Not Page.IsPostBack then dim mycdcatalog=New DataSet mycdcatalog.ReadXml(MapPath("cdcatalog.xml")) cdcatalog.DataSource=mycdcatalog cdcatalog.DataBind() end if end sub </script> <html> <body> <form runat="server"> <asp:Repeater id="cdcatalog" runat="server"> <HeaderTemplate> <table border="1" width="100%"> <tr> <th>Title</th> <th>Artist</th> <th>Country</th> <th>Company</th> <th>Price</th> <th>Year</th> </tr> </HeaderTemplate> <ItemTemplate> <tr> <td><%#Container.DataItem("title")%></td> <td><%#Container.DataItem("artist")%></td> <td><%#Container.DataItem("country")%></td> <td><%#Container.DataItem("company")%></td> <td><%#Container.DataItem("price")%></td> <td><%#Container.DataItem("year")%></td> </tr> </ItemTemplate> <FooterTemplate> </table> </FooterTemplate> </asp:Repeater> </form> </body> </html>
您可以在 <ItemTemplate> 元素後新增 <AlternatingItemTemplate> 元素,用來描述輸出中交替行的外觀。在下面的例項中,表格每隔一行就會顯示為淺灰色的背景:
例項
<%@ Import Namespace="System.Data" %> <script runat="server"> sub Page_Load if Not Page.IsPostBack then dim mycdcatalog=New DataSet mycdcatalog.ReadXml(MapPath("cdcatalog.xml")) cdcatalog.DataSource=mycdcatalog cdcatalog.DataBind() end if end sub </script> <html> <body> <form runat="server"> <asp:Repeater id="cdcatalog" runat="server"> <HeaderTemplate> <table border="1" width="100%"> <tr> <th>Title</th> <th>Artist</th> <th>Country</th> <th>Company</th> <th>Price</th> <th>Year</th> </tr> </HeaderTemplate> <ItemTemplate> <tr> <td><%#Container.DataItem("title")%></td> <td><%#Container.DataItem("artist")%></td> <td><%#Container.DataItem("country")%></td> <td><%#Container.DataItem("company")%></td> <td><%#Container.DataItem("price")%></td> <td><%#Container.DataItem("year")%></td> </tr> </ItemTemplate> <AlternatingItemTemplate> <tr bgcolor="#e8e8e8"> <td><%#Container.DataItem("title")%></td> <td><%#Container.DataItem("artist")%></td> <td><%#Container.DataItem("country")%></td> <td><%#Container.DataItem("company")%></td> <td><%#Container.DataItem("price")%></td> <td><%#Container.DataItem("year")%></td> </tr> </AlternatingItemTemplate> <FooterTemplate> </table> </FooterTemplate> </asp:Repeater> </form> </body> </html>
<SeparatorTemplate> 元素用於描述每個記錄之間的分隔符。在下面的例項中,每個表格行之間插入了一條水平線:
例項
<%@ Import Namespace="System.Data" %> <script runat="server"> sub Page_Load if Not Page.IsPostBack then dim mycdcatalog=New DataSet mycdcatalog.ReadXml(MapPath("cdcatalog.xml")) cdcatalog.DataSource=mycdcatalog cdcatalog.DataBind() end if end sub </script> <html> <body> <form runat="server"> <asp:Repeater id="cdcatalog" runat="server"> <HeaderTemplate> <table border="0" width="100%"> <tr> <th>Title</th> <th>Artist</th> <th>Country</th> <th>Company</th> <th>Price</th> <th>Year</th> </tr> </HeaderTemplate> <ItemTemplate> <tr> <td><%#Container.DataItem("title")%></td> <td><%#Container.DataItem("artist")%></td> <td><%#Container.DataItem("country")%></td> <td><%#Container.DataItem("company")%></td> <td><%#Container.DataItem("price")%></td> <td><%#Container.DataItem("year")%></td> </tr> </ItemTemplate> <SeparatorTemplate> <tr> <td colspan="6"><hr /></td> </tr> </SeparatorTemplate> <FooterTemplate> </table> </FooterTemplate> </asp:Repeater> </form> </body> </html>
原文來自:
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69955379/viewspace-2897683/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- ASP.NET Web Forms – Button 控制元件簡介ASP.NETWebORM控制元件
- ASP.NET Web Forms – TextBox 控制元件簡介ASP.NETWebORM控制元件
- ASP.NET Web Forms – Web 伺服器控制元件簡介ASP.NETWebORM伺服器控制元件
- ASP.NET Web Forms – 伺服器控制元件簡介ASP.NETWebORM伺服器控制元件
- ASP.NET Web Forms – 事件簡介ASP.NETWebORM事件
- ASP.NET Web Forms – SortedList 物件簡介ASP.NETWebORM物件
- ASP.NET Web Forms – Hashtable 物件簡介ASP.NETWebORM物件
- ASP.NET Web Forms – ArrayList 物件簡介ASP.NETWebORM物件
- ASP.NET Web Forms – 導航簡介ASP.NETWebORM
- ASP.NET Web Forms – HTML 表單簡介ASP.NETWebORMHTML
- ASP.NET Web Forms – HTML 頁面簡介ASP.NETWebORMHTML
- ASP.NET Web Forms – XML 檔案簡介ASP.NETWebORMXML
- ASP.NET Web Forms – 資料庫連線簡介ASP.NETWebORM資料庫
- ASP.NET Web Pages – 物件簡介ASP.NETWeb物件
- ASP.NET Web 窗體- 保持 ViewState簡介ASP.NETWebView
- ASP.NET Web Pages – 幫助器簡介ASP.NETWeb
- ASP.NET Web Pages – 資料夾簡介ASP.NETWeb
- ASP.NET Web Pages – 頁面佈局簡介ASP.NETWeb
- ASP.NET Web Pages – Chart 幫助器簡介ASP.NETWeb
- C#控制元件之Repeater控制元件使用C#控制元件
- 動態綁資料(Repeater控制元件控制元件
- ASP.NET MVC – 安全簡介ASP.NETMVC
- ASP.NET MVC – 模型簡介ASP.NETMVC模型
- 移動web——移動web開發簡介,WebStorgae簡介Web
- 鴻蒙安全控制元件簡介鴻蒙控制元件
- ASP.NET MVC – 檢視簡介ASP.NETMVC
- ASP.NET Razor – 標記簡介ASP.NET
- 【譯】Web Components簡介Web
- 鴻蒙安全控制元件之位置控制元件簡介鴻蒙控制元件
- 鴻蒙安全控制元件之儲存控制元件簡介鴻蒙控制元件
- 鴻蒙安全控制元件之貼上控制元件簡介鴻蒙控制元件
- ASP.NET MVC – 控制器簡介ASP.NETMVC
- JSON Web Token(JWT) 簡介JSONWebJWT
- ASP.NET MVC – SQL 資料庫簡介ASP.NETMVCSQL資料庫
- ASP.NET Razor – C# 變數簡介ASP.NETC#變數
- ASP.NET 網頁- HTML 表單簡介ASP.NET網頁HTML
- web workers簡介(三)建立subworkerWeb
- Web API的簡史介紹WebAPI