ASP.NET - DataList 控件

DataList 控件，类似于 Repeater 控件，用于显示限制于该控件的项目的重复列表。不过，DataList 控件会默认地在数据项目上添加表格。

实例

DataList 控件

  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:DataList
  19. id="cdcatalog"
  20. gridlines="Both"
  21. runat="server">
  23. <HeaderTemplate>
  24. My CD Catalog
  25. </HeaderTemplate>
  27. <ItemTemplate>
  28. "<%#Container.DataItem("title")%>" of <%#Container.DataItem("artist")%>  - $<%#Container.DataItem("price")%>
  29. </ItemTemplate>
  31. <FooterTemplate>
  32. Copy Right jishuchi.com
  33. </FooterTemplate>
  35. </asp:DataList>
  36. </form>
  38. </body>
  39. </html>

带有样式的 DataList 控件

  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:DataList id="cdcatalog"
  19. runat="server"
  20. cellpadding="2"
  21. cellspacing="2"
  22. borderstyle="inset"
  23. backcolor="#e8e8e8"
  24. width="100%"
  25. headerstyle-font-name="Verdana"
  26. headerstyle-font-size="12pt"
  27. headerstyle-horizontalalign="center"
  28. headerstyle-font-bold="True"
  29. itemstyle-backcolor="#778899"
  30. itemstyle-forecolor="#ffffff"
  31. footerstyle-font-size="9pt"
  32. footerstyle-font-italic="True">
  34. <HeaderTemplate>
  35. My CD Catalog
  36. </HeaderTemplate>
  38. <ItemTemplate>
  39. "<%#Container.DataItem("title")%>" of <%#Container.DataItem("artist")%>  - $<%#Container.DataItem("price")%>
  40. </ItemTemplate>
  42. <FooterTemplate>
  43. Copy Right jishuchi.com
  44. </FooterTemplate>
  46. </asp:DataList>
  47. </form>
  49. </body>
  50. </html>

带有 <AlternatingItemTemplate> 的 DataList 控件

  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:DataList id="cdcatalog"
  19. runat="server"
  20. cellpadding="2"
  21. cellspacing="2"
  22. borderstyle="inset"
  23. backcolor="#e8e8e8"
  24. width="100%"
  25. headerstyle-font-name="Verdana"
  26. headerstyle-font-size="12pt"
  27. headerstyle-horizontalalign="center"
  28. headerstyle-font-bold="True"
  29. itemstyle-backcolor="#778899"
  30. itemstyle-forecolor="#ffffff"
  31. alternatingitemstyle-backcolor="#e8e8e8"
  32. alternatingitemstyle-forecolor="#000000"
  33. footerstyle-font-size="9pt"
  34. footerstyle-font-italic="True">
  36. <HeaderTemplate>
  37. My CD Catalog
  38. </HeaderTemplate>
  40. <ItemTemplate>
  41. "<%#Container.DataItem("title")%>" of <%#Container.DataItem("artist")%>  - $<%#Container.DataItem("price")%>
  42. </ItemTemplate>
  44. <AlternatingItemTemplate>
  45. "<%#Container.DataItem("title")%>" of <%#Container.DataItem("artist")%>  - $<%#Container.DataItem("price")%>
  46. </AlternatingItemTemplate>
  48. <FooterTemplate>
  49. Copy Right jishuchi.com
  50. </FooterTemplate>
  52. </asp:DataList>
  53. </form>
  55. </body>
  56. </html>

把 DataSet 绑定到 DataList 控件

DataList 控件，类似于 Repeater 控件，用于显示限制于该控件的项目的重复列表。不过，DataList 控件会默认地在数据项目上添加表格。DataList 控件可被绑定到数据库表、XML 文件或者其他项目列表。这里，我们将展示如何把 XML 文件绑定到一个 DataList 控件。

我们将在例子中使用下面的 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 页面中创建一个 DataList 控件。<HeaderTemplate> 元素中的内容在输出中仅出现一次，而 <ItemTemplate> 元素的内容会对应 DataSet 中的 "record" 重复出现，最后，<FooterTemplate> 的内容在输出中仅出现一次：

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

然后我们添加可创建 DataSet 的脚本，并把这个 mycdcatalog DataSet 绑定到 DataList 控件。我们同样使用这些元素来填充该 DataList 控件：包含表头的 <HeaderTemplate>，包含要显示的数据项的 <ItemTemplate>，以及包含文本的 <FooterTemplate>。请注意，DataList 的 gridlines 属性被设置为 "both"，以显示表格边框：

  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:DataList id="cdcatalog"
  19. gridlines="both" runat="server">
  20.  
  21. <HeaderTemplate>
  22. My CD Catalog
  23. </HeaderTemplate>
  24.  
  25. <ItemTemplate>
  26. "<%#Container.DataItem("title")%>" of
  27. <%#Container.DataItem("artist")%> -
  28. $<%#Container.DataItem("price")%>
  29. </ItemTemplate>
  30.  
  31. <FooterTemplate>
  32. Copyright jishuchi.com
  33. </FooterTemplate>
  34.  
  35. </asp:DataList>
  36. </form>
  37.  
  38. </body>
  39. </html>

使用样式

您也可以向 DataList 控件添加样式，让它更加时髦：

  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:DataList id="cdcatalog"
  19. runat="server"
  20. cellpadding="2"
  21. cellspacing="2"
  22. borderstyle="inset"
  23. backcolor="#e8e8e8"
  24. width="100%"
  25. headerstyle-font-name="Verdana"
  26. headerstyle-font-size="12pt"
  27. headerstyle-horizontalalign="center"
  28. headerstyle-font-bold="true"
  29. itemstyle-backcolor="#778899"
  30. itemstyle-forecolor="#ffffff"
  31. footerstyle-font-size="9pt"
  32. footerstyle-font-italic="true">
  33.  
  34. <HeaderTemplate>
  35. My CD Catalog
  36. </HeaderTemplate>
  37.  
  38. <ItemTemplate>
  39. "<%#Container.DataItem("title")%>" of
  40. <%#Container.DataItem("artist")%> -
  41. $<%#Container.DataItem("price")%>
  42. </ItemTemplate>
  43.  
  44. <FooterTemplate>
  45. Copyright jishuchi.com
  46. </FooterTemplate>
  47.  
  48. </asp:DataList>
  49. </form>
  50.  
  51. </body>
  52. </html>

使用 <AlternatingItemTemplate>

您可以在 <ItemTemplate> 元素后添加 <AlternatingItemTemplate> 元素，这样就可以描述交替行的外观了。您可以在 DataList 控件内部对 <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:DataList id="cdcatalog"
  19. runat="server"
  20. cellpadding="2"
  21. cellspacing="2"
  22. borderstyle="inset"
  23. backcolor="#e8e8e8"
  24. width="100%"
  25. headerstyle-font-name="Verdana"
  26. headerstyle-font-size="12pt"
  27. headerstyle-horizontalalign="center"
  28. headerstyle-font-bold="True"
  29. itemstyle-backcolor="#778899"
  30. itemstyle-forecolor="#ffffff"
  31. alternatingitemstyle-backcolor="#e8e8e8"
  32. alternatingitemstyle-forecolor="#000000"
  33. footerstyle-font-size="9pt"
  34. footerstyle-font-italic="True">
  35.  
  36. <HeaderTemplate>
  37. My CD Catalog
  38. </HeaderTemplate>
  39.  
  40. <ItemTemplate>
  41. "<%#Container.DataItem("title")%>" of
  42. <%#Container.DataItem("artist")%> -
  43. $<%#Container.DataItem("price")%>
  44. </ItemTemplate>
  45.  
  46. <AlternatingItemTemplate>
  47. "<%#Container.DataItem("title")%>" of
  48. <%#Container.DataItem("artist")%> -
  49. $<%#Container.DataItem("price")%>
  50. </AlternatingItemTemplate>
  51.  
  52. <FooterTemplate>
  53. &copy; jishuchi.com
  54. </FooterTemplate>
  55.  
  56. </asp:DataList>
  57. </form>
  58.  
  59. </body>
  60. </html>