ASP.NET - Kontrolka DataList

Kontrolka DataList, podobna do kontrolki Repeater, służy do wyświetlania powtarzających się list elementów ograniczonych do tej kontrolki. Jednak kontrolka DataList domyślnie dodaje tabelę do elementów danych.

Przykład

Kontrolka DataList
Kontrolka DataList z stylem
Kontrolka DataList z <AlternatingItemTemplate>

Powiązanie DataSet z kontrolką DataList

Kontrolka DataList, podobna do kontrolki Repeater, służy do wyświetlania powtarzających się list elementów ograniczonych do tej kontrolki. Jednak kontrolka DataList domyślnie dodaje tabelę do elementów danych. Kontrolka DataList może być powiązana z tabelą bazy danych, plikiem XML lub inną listą elementów. W tym przykładzie pokażemy, jak powiązać plik XML z kontrolką DataList.

Użyjemy poniższego pliku XML w przykładzie ("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>

Proszę, sprawdź ten plik XML:cdcatalog.xml

Najpierw zaimportuj przestrzeń nazw "System.Data". Potrzebujemy tej przestrzeni nazw do pracy z obiektem DataSet. W górze strony .aspx zawiera poniższe polecenie:

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

Następnie utwórz DataSet dla tego pliku XML i załaduj ten plik XML do DataSet podczas pierwszego ładowania strony:

<script runat="server">
sub Page_Load
if Not Page.IsPostBack then
  dim mycdcatalog=New DataSet
  mycdcatalog.ReadXml(MapPath("cdcatalog.xml"))
end if
end sub

Następnie tworzymy kontrolkę DataList na stronie .aspx. Zawartość elementu <HeaderTemplate> pojawia się tylko raz w wynikach wyjściowych, podczas gdy zawartość elementu <ItemTemplate> odpowiada powtarzającym się "record" w DataSet, w końcu zawartość <FooterTemplate> pojawia się tylko raz w wynikach wyjściowych:

<html>
<body>
<form runat="server">
<asp:DataList id="cdcatalog" runat="server">
<HeaderTemplate>
...
</HeaderTemplate>
<ItemTemplate>
...
</ItemTemplate>
<FooterTemplate>
...
</FooterTemplate>
</asp:DataList>
</form>
</body>
</html>

Następnie dodaj skrypt, który tworzy DataSet, a następnie przypisz ten DataSet mycdcatalog do kontrolki DataList. Również używamy tych elementów, aby wypełnić kontrolkę DataList: <HeaderTemplate> zawierający nagłówek, <ItemTemplate> zawierający dane do wyświetlenia oraz <FooterTemplate> zawierający tekst. Proszę zauważyć, że atrybut gridlines kontrolki DataList jest ustawiony na "both", aby wyświetlić ramki tabeli:

<%@ 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:DataList id="cdcatalog"
gridlines="both" runat="server">
<HeaderTemplate>
Mój Katalog CD
</HeaderTemplate>
<ItemTemplate>
"<%#Container.DataItem("title")%>" z
<%#Container.DataItem("artist")%> -
$<%#Container.DataItem("price")%>
</ItemTemplate>
<FooterTemplate>
Copyright codew3c.com
</FooterTemplate>
</asp:DataList>
</form>
</body>
</html>

Wyświetl ten przykład

Używając stylu

Możesz również dodać styl do kontrolki DataList, aby uczynić ją bardziej modną:

<%@ 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:DataList id="cdcatalog"
runat="server"
cellpadding="2"
cellspacing="2"
borderstyle="inset"
backcolor="#e8e8e8"
width="100%"
headerstyle-font-name="Verdana"
headerstyle-font-size="12pt"
headerstyle-horizontalalign="center"
headerstyle-font-bold="true"
itemstyle-backcolor="#778899"
itemstyle-forecolor="#ffffff"
footerstyle-font-size="9pt"
footerstyle-font-italic="true"
<HeaderTemplate>
Mój Katalog CD
</HeaderTemplate>
<ItemTemplate>
"<%#Container.DataItem("title")%>" z
<%#Container.DataItem("artist")%> -
$<%#Container.DataItem("price")%>
</ItemTemplate>
<FooterTemplate>
Copyright codew3c.com
</FooterTemplate>
</asp:DataList>
</form>
</body>
</html>

Wyświetl ten przykład

Używając <AlternatingItemTemplate>

Możesz dodać element <AlternatingItemTemplate> po elemencie <ItemTemplate>, aby opisać wygląd przeplatanych wierszy. Możesz stylizować dane w części <AlternatingItemTemplate> wewnętrznie kontrolki DataList:

<%@ 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:DataList id="cdcatalog"
runat="server"
cellpadding="2"
cellspacing="2"
borderstyle="inset"
backcolor="#e8e8e8"
width="100%"
headerstyle-font-name="Verdana"
headerstyle-font-size="12pt"
headerstyle-horizontalalign="center"
headerstyle-font-bold="True"
itemstyle-backcolor="#778899"
itemstyle-forecolor="#ffffff"
alternatingitemstyle-backcolor="#e8e8e8"
alternatingitemstyle-forecolor="#000000"
footerstyle-font-size="9pt"
footerstyle-font-italic="True">
<HeaderTemplate>
Mój Katalog CD
</HeaderTemplate>
<ItemTemplate>
"<%#Container.DataItem("title")%>" z
<%#Container.DataItem("artist")%> -
$<%#Container.DataItem("price")%>
</ItemTemplate>
<AlternatingItemTemplate>
"<%#Container.DataItem("title")%>" z
<%#Container.DataItem("artist")%> -
$<%#Container.DataItem("price")%>
</AlternatingItemTemplate>
<FooterTemplate>
© codew3c.com
</FooterTemplate>
</asp:DataList>
</form>
</body>
</html>

Wyświetl ten przykład