ASP.NET - Repeater 控件

Repeater 控件用于显示重复的项目列表，这些项目被限制在该控件。

实例

Repeater 控件

  1. <%@ Import Namespace="System.Data" %>
  3. <script  runat="server">
  4. sub Page_Load
  5. if Not Page.IsPostBack then
  6.    dim mycdcatalog=New DataSet
  7.    mycdcatalog.ReadXml(MapPath("cdcatalog.xml"))
  8.    cdcatalog.DataSource=mycdcatalog
  9.    cdcatalog.DataBind()
  10. end if
  11. end sub
  12. </script>
  14. <html>
  15. <body>
  17. <form runat="server">
  18. <asp:Repeater id="cdcatalog" runat="server">
  20. <HeaderTemplate>
  21. <table border="1" width="100%">
  22. <tr>
  23. <th>Title</th>
  24. <th>Artist</th>
  25. <th>Company</th>
  26. <th>Price</th>
  27. </tr>
  28. </HeaderTemplate>
  30. <ItemTemplate>
  31. <tr>
  32. <td><%#Container.DataItem("title")%> </td>
  33. <td><%#Container.DataItem("artist")%> </td>
  34. <td><%#Container.DataItem("company")%> </td>
  35. <td><%#Container.DataItem("price")%> </td>
  36. </tr>
  37. </ItemTemplate>
  39. <FooterTemplate>
  40. </table>
  41. </FooterTemplate>
  43. </asp:Repeater>
  44. </form>
  46. </body>
  47. </html>

带有 <AlternatingItemTemplate> 的 Repeater 控件

  1. <%@ Import Namespace="System.Data" %>
  3. <script  runat="server">
  4. sub Page_Load
  5. if Not Page.IsPostBack then
  6.    dim mycdcatalog=New DataSet
  7.    mycdcatalog.ReadXml(MapPath("cdcatalog.xml"))
  8.    cdcatalog.DataSource=mycdcatalog
  9.    cdcatalog.DataBind()
  10. end if
  11. end sub
  12. </script>
  14. <html>
  15. <body>
  17. <form runat="server">
  18. <asp:Repeater id="cdcatalog" runat="server">
  20. <HeaderTemplate>
  21. <table border="1" width="100%">
  22. <tr>
  23. <th>Title</th>
  24. <th>Artist</th>
  25. <th>Company</th>
  26. <th>Price</th>
  27. </tr>
  28. </HeaderTemplate>
  30. <ItemTemplate>
  31. <tr>
  32. <td><%#Container.DataItem("title")%> </td>
  33. <td><%#Container.DataItem("artist")%> </td>
  34. <td><%#Container.DataItem("company")%> </td>
  35. <td><%#Container.DataItem("price")%> </td>
  36. </tr>
  37. </ItemTemplate>
  39. <AlternatingItemTemplate>
  40. <tr bgcolor="#e8e8e8">
  41. <td><%#Container.DataItem("title")%> </td>
  42. <td><%#Container.DataItem("artist")%> </td>
  43. <td><%#Container.DataItem("company")%> </td>
  44. <td><%#Container.DataItem("price")%> </td>
  45. </tr>
  46. </AlternatingItemTemplate>
  48. <FooterTemplate>
  49. </table>
  50. </FooterTemplate>
  52. </asp:Repeater>
  53. </form>
  55. </body>
  56. </html>

带有 <SeparatorTemplate> 的 Repeater 控件

  1. <%@ Import Namespace="System.Data" %>
  3. <script  runat="server">
  4. sub Page_Load
  5. if Not Page.IsPostBack then
  6.    dim mycdcatalog=New DataSet
  7.    mycdcatalog.ReadXml(MapPath("cdcatalog.xml"))
  8.    cdcatalog.DataSource=mycdcatalog
  9.    cdcatalog.DataBind()
  10. end if
  11. end sub
  12. </script>
  14. <html>
  15. <body>
  17. <form runat="server">
  18. <asp:Repeater id="cdcatalog" runat="server">
  20. <HeaderTemplate>
  21. <table border="0" width="100%">
  22. <tr>
  23. <th align="left">Title</th>
  24. <th align="left">Artist</th>
  25. <th align="left">Company</th>
  26. <th align="left">Price</th>
  27. </tr>
  28. </HeaderTemplate>
  30. <ItemTemplate>
  31. <tr>
  32. <td><%#Container.DataItem("title")%> </td>
  33. <td><%#Container.DataItem("artist")%> </td>
  34. <td><%#Container.DataItem("company")%> </td>
  35. <td><%#Container.DataItem("price")%> </td>
  36. </tr>
  37. </ItemTemplate>
  39. <SeparatorTemplate>
  40. <tr>
  41. <td colspan="6"><hr /></td>
  42. </tr>
  43. </SeparatorTemplate>
  45. <FooterTemplate>
  46. </table>
  47. </FooterTemplate>
  49. </asp:Repeater>
  50. </form>
  52. </body>
  53. </html>

把 DataSet 绑定到 Repeater 控件

Repeater 控件用于显示重复的项目列表，这些项目被限制在该控件。Repeater 控件可被绑定到数据库表、XML 文件或者其他项目列表。这里，我们将展示如何把 XML 文件绑定到一个 Repeater 控件。

我们将在例子中使用下面的 XML 文件("cdcatalog.xml")：

  1. <?xml version="1.0" encoding="ISO-8859-1"?>
  2.  
  3. <catalog>
  4. <cd>
  5.   <title>Empire Burlesque</title>
  6.   <artist>Bob Dylan</artist>
  7.   <country>USA</country>
  8.   <company>Columbia</company>
  9.   <price>10.90</price>
  10.   <year>1985</year>
  11. </cd>
  12. <cd>
  13.   <title>Hide your heart</title>
  14.   <artist>Bonnie Tyler</artist>
  15.   <country>UK</country>
  16.   <company>CBS Records</company>
  17.   <price>9.90</price>
  18.   <year>1988</year>
  19. </cd>
  20. <cd>
  21.   <title>Greatest Hits</title>
  22.   <artist>Dolly Parton</artist>
  23.   <country>USA</country>
  24.   <company>RCA</company>
  25.   <price>9.90</price>
  26.   <year>1982</year>
  27. </cd>
  28. <cd>
  29.   <title>Still got the blues</title>
  30.   <artist>Gary Moore</artist>
  31.   <country>UK</country>
  32.   <company>Virgin records</company>
  33.   <price>10.20</price>
  34.   <year>1990</year>
  35. </cd>
  36. <cd>
  37.   <title>Eros</title>
  38.   <artist>Eros Ramazzotti</artist>
  39.   <country>EU</country>
  40.   <company>BMG</company>
  41.   <price>9.90</price>
  42.   <year>1997</year>
  43. </cd>
  44. </catalog>

首先，导入 "System.Data" 命名空间。我们需要此命名空间与 DataSet 对象一同工作。在 .aspx 页面的顶部包含下面这条指令：

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

接下来，为这个 XML 文件创建一个 DataSet，并把此 XML 文件在页面首次加载时载入 DataSet：

  1. <script runat="server">
  2. sub Page_Load
  3. if Not Page.IsPostBack then
  4.   dim mycdcatalog=New DataSet
  5.   mycdcatalog.ReadXml(MapPath("cdcatalog.xml"))
  6. end if
  7. end sub

然后我们在 .aspx 页面中创建一个 Repeater 控件。<HeaderTemplate> 元素中的内容在输出中仅出现一次，而 <ItemTemplate> 元素的内容会对应 DataSet 中的 "record" 重复出现，最后，<FooterTemplate> 的内容在输出中仅出现一次：

  1. <html>
  2. <body>
  3.  
  4. <form runat="server">
  5. <asp:Repeater id="cdcatalog" runat="server">
  7. <HeaderTemplate>
  8. ...
  9. </HeaderTemplate>
  11. <ItemTemplate>
  12. ...
  13. </ItemTemplate>
  15. <FooterTemplate>
  16. ...
  17. </FooterTemplate>
  19. </asp:Repeater>
  20. </form>
  21.  
  22. </body>
  23. </html>

然后我们添加可创建 DataSet 的脚本，并把这个 mycdcatalog DataSet 绑定到 Repeater 控件。我们同样用 HTML 标签来填充这个 Repeater 控件，并通过 <%#Container.DataItem("fieldname")%> 方法把数据项目绑定到 <ItemTemplate> 部分内的单元格：

  1. <%@ Import Namespace="System.Data" %>
  2.  
  3. <script runat="server">
  4. sub Page_Load
  5. if Not Page.IsPostBack then
  6.   dim mycdcatalog=New DataSet
  7.   mycdcatalog.ReadXml(MapPath("cdcatalog.xml"))
  8.   cdcatalog.DataSource=mycdcatalog
  9.   cdcatalog.DataBind()
  10. end if
  11. end sub
  12. </script>
  13.  
  14. <html>
  15. <body>
  16.  
  17. <form runat="server">
  18. <asp:Repeater id="cdcatalog" runat="server">
  19.  
  20. <HeaderTemplate>
  21. <table border="1" width="100%">
  22. <tr>
  23. <th>Title</th>
  24. <th>Artist</th>
  25. <th>Country</th>
  26. <th>Company</th>
  27. <th>Price</th>
  28. <th>Year</th>
  29. </tr>
  30. </HeaderTemplate>
  31.  
  32. <ItemTemplate>
  33. <tr>
  34. <td><%#Container.DataItem("title")%></td>
  35. <td><%#Container.DataItem("artist")%></td>
  36. <td><%#Container.DataItem("country")%></td>
  37. <td><%#Container.DataItem("company")%></td>
  38. <td><%#Container.DataItem("price")%></td>
  39. <td><%#Container.DataItem("year")%></td>
  40. </tr>
  41. </ItemTemplate>
  42.  
  43. <FooterTemplate>
  44. </table>
  45. </FooterTemplate>
  46.  
  47. </asp:Repeater>
  48. </form>
  49.  
  50. </body>
  51. </html>

使用 <AlternatingItemTemplate>

您可以在 <ItemTemplate> 元素后添加 <AlternatingItemTemplate> 元素，这样就可以描述交替行的外观了。在下面的例子中，该表格中每隔一行就会显示为浅灰色的背景：

  1. <%@ Import Namespace="System.Data" %>
  2.  
  3. <script runat="server">
  4. sub Page_Load
  5. if Not Page.IsPostBack then
  6.   dim mycdcatalog=New DataSet
  7.   mycdcatalog.ReadXml(MapPath("cdcatalog.xml"))
  8.   cdcatalog.DataSource=mycdcatalog
  9.   cdcatalog.DataBind()
  10. end if
  11. end sub
  12. </script>
  13.  
  14. <html>
  15. <body>
  16.  
  17. <form runat="server">
  18. <asp:Repeater id="cdcatalog" runat="server">
  19.  
  20. <HeaderTemplate>
  21. <table border="1" width="100%">
  22. <tr>
  23. <th>Title</th>
  24. <th>Artist</th>
  25. <th>Country</th>
  26. <th>Company</th>
  27. <th>Price</th>
  28. <th>Year</th>
  29. </tr>
  30. </HeaderTemplate>
  31.  
  32. <ItemTemplate>
  33. <tr>
  34. <td><%#Container.DataItem("title")%></td>
  35. <td><%#Container.DataItem("artist")%></td>
  36. <td><%#Container.DataItem("country")%></td>
  37. <td><%#Container.DataItem("company")%></td>
  38. <td><%#Container.DataItem("price")%></td>
  39. <td><%#Container.DataItem("year")%></td>
  40. </tr>
  41. </ItemTemplate>
  42.  
  43. <AlternatingItemTemplate>
  44. <tr bgcolor="#e8e8e8">
  45.  
  46. <td><%#Container.DataItem("title")%></td>
  47. <td><%#Container.DataItem("artist")%></td>
  48. <td><%#Container.DataItem("country")%></td>
  49. <td><%#Container.DataItem("company")%></td>
  50. <td><%#Container.DataItem("price")%></td>
  51. <td><%#Container.DataItem("year")%></td>
  52. </tr>
  53. </AlternatingItemTemplate>
  54.  
  55. <FooterTemplate>
  56. </table>
  57. </FooterTemplate>
  58.  
  59. </asp:Repeater>
  60. </form>
  61.  
  62. </body>
  63. </html>

使用 <SeparatorTemplate>

<SeparatorTemplate> 元素能够用于描述每个记录之间的分隔符。下面的例子在每个表格行之间插入了一条水平线：

  1. <%@ Import Namespace="System.Data" %>
  2.  
  3. <script runat="server">
  4. sub Page_Load
  5. if Not Page.IsPostBack then
  6.   dim mycdcatalog=New DataSet
  7.   mycdcatalog.ReadXml(MapPath("cdcatalog.xml"))
  8.   cdcatalog.DataSource=mycdcatalog
  9.   cdcatalog.DataBind()
  10. end if
  11. end sub
  12. </script>
  13.  
  14. <html>
  15. <body>
  16.  
  17. <form runat="server">
  18. <asp:Repeater id="cdcatalog" runat="server">
  19.  
  20. <HeaderTemplate>
  21. <table border="0" width="100%">
  22. <tr>
  23. <th>Title</th>
  24. <th>Artist</th>
  25. <th>Country</th>
  26. <th>Company</th>
  27. <th>Price</th>
  28. <th>Year</th>
  29. </tr>
  30. </HeaderTemplate>
  31.  
  32. <ItemTemplate>
  33. <tr>
  34. <td><%#Container.DataItem("title")%></td>
  35. <td><%#Container.DataItem("artist")%></td>
  36. <td><%#Container.DataItem("country")%></td>
  37. <td><%#Container.DataItem("company")%></td>
  38. <td><%#Container.DataItem("price")%></td>
  39. <td><%#Container.DataItem("year")%></td>
  40. </tr>
  41. </ItemTemplate>
  42.  
  43. <SeparatorTemplate>
  44. <tr>
  45. <td colspan="6"><hr /></td>
  46. </tr>
  47. </SeparatorTemplate>
  48.  
  49. <FooterTemplate>
  50. </table>
  51. </FooterTemplate>
  52.  
  53. </asp:Repeater>
  54. </form>
  55.  
  56. </body>
  57. </html>