Formulir Web ASP.NET - Kontrol Daftar Data
Bagian ini memperkenalkan Kontrol ASP.NET DataList lebih fleksibel dibandingkan kontrol Repeater. Kontrol DataList menyajikan data dalam bentuk tabel.Kontrol DataList, mirip dengan kontrol Repeater, digunakan untuk menampilkan daftar berulang item yang terikat pada kontrol. Namun, kontrol DataList menambahkan tabel ke item data secara default.
Ikat DataSet ke kontrol DataList
Kontrol DataList, mirip dengan kontrol Repeater, digunakan untuk menampilkan daftar berulang item yang terikat pada kontrol. Namun, kontrol DataList menambahkan tabel ke item data secara default. Kontrol DataList bisa diikat ke tabel database, file XML, atau daftar item lainnya. Di sini, kami akan mendemonstrasikan cara mengikat file XML ke kontrol DataList.
Dalam contoh kita, kita akan menggunakan file XML berikut ("cdcatalog.xml"):
<?xml version="1.0" coding="ISO-8859-1"?><catalog><cd><title>Empire Burlesque</title><artist>Bob Dylan</artist><country>USA</country ><company>Kolumbia</company><price>10.90</price><year>1985</year></cd><cd><title>Sembunyikan hatimu</title><artist>Bonnie Tyler</artist><country>Inggris</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>Masih mendapatkan blues</title><artist>Gary Moore</artist><country>UK</country><company>Virgin rekor</company><price>10.20</price><year>1990</year></cd><cd><title>Eros</title><artist>Eros Ramazzotti</artist><country>EU< /negara><perusahaan>BMG</perusahaan><price>9,90</price><tahun>1997</year></cd></catalog>Lihat file XML ini: cdcatalog.xml
Pertama, impor namespace "System.Data". Kita memerlukan namespace ini untuk bekerja dengan objek DataSet. Sertakan arahan berikut di bagian atas halaman .aspx Anda:
<%@ Impor Namespace="Sistem.Data" %>Selanjutnya, buat DataSet untuk file XML dan muat file XML ke dalam DataSet saat halaman pertama kali dimuat:
<script runat="server">sub Page_Loadif Bukan Page.IsPostBack lalu dim mycdcatalog=New DataSetmycdcatalog.ReadXml(MapPath("cdcatalog.xml"))end ifend subKemudian kita membuat kontrol DataList di halaman .aspx. Konten dalam elemen <HeaderTemplate> dirender terlebih dahulu dan hanya muncul sekali dalam output, sedangkan konten dalam elemen <ItemTemplate> diulang untuk setiap "catatan" di DataSet. Terakhir, konten dalam elemen <FooterTemplate> dirender Hanya muncul sekali di keluaran:
<html><body><form runat="server"><asp:DataList id="cdcatalog" runat="server"><HeaderTemplate>...</HeaderTemplate><ItemTemplate>...</ItemTemplate>< FooterTemplate>...</FooterTemplate></asp:DataList></form></body></html>Kemudian kita menambahkan skrip untuk membuat DataSet dan mengikat DataSet mycdcatalog ke kontrol DataList. Kontrol DataList kemudian diisi dengan <HeaderTemplate> yang berisi header, <ItemTemplate> yang berisi item data yang akan ditampilkan, dan <FooterTemplate> yang berisi teks. Perhatikan bahwa Anda dapat menyetel properti garis kisi DataList ke "keduanya" untuk menampilkan batas tabel:
Contoh
<%@ Import Namespace="System.Data" %><script runat="server">sub Page_Loadif Not Page.IsPostBack lalu mycdcatalog=New DataSetmycdcatalog.ReadXml(MapPath("cdcatalog.xml"))cdcatalog.DataSource=mycdcatalogcdcatalog. DataBind()end ifend sub</script><html><body><form runat="server"><asp:DataList id="cdcatalog"gridlines="keduanya" runat="server"><HeaderTemplate>Katalog CD Saya</HeaderTemplate><ItemTemplate>"<%#Container.DataItem("title" )%>" dari<%#Container.DataItem("artis")%> -$<%#Container.DataItem("price")%></ItemTemplate><FooterTemplate>Hak Cipta Dilindungi </FooterTemplate></asp:DataList></form></body></html>Gunakan gaya
Anda juga dapat menambahkan gaya ke kontrol DataList untuk membuat hasilnya lebih menarik:
Contoh
<%@ Import Namespace="System.Data" %><script runat="server">sub Page_Loadif Not Page.IsPostBack lalu mycdcatalog=New DataSetmycdcatalog.ReadXml(MapPath("cdcatalog.xml"))cdcatalog.DataSource=mycdcatalogcdcatalog. DataBind()end ifend sub</script><html><body><form runat="server"><asp:DataList id=”cdcatalog”runat=”server”cellpadding=”2”cellspacing=”2”borderstyle=”inset”backcolor=”#e8e8e8”headerstyle-font-name=”Verdana”headerstyle-font-size=”12pt”headerstyle -horizonta lalign="center"headerstyle-font-bold="true"itemstyle-backcolor="#778899"itemstyle-forecolor="#ffffff"footerstyle-font-size="9pt"footerstyle-font-italic="true">< Templat Tajuk>Saya Katalog CD</HeaderTemplate><ItemTemplate>"<%#Container.DataItem("title")%>" dari<%#Container.DataItem("artist")%> -$<%#Container.DataItem("price" )%></ItemTemplate><FooterTemplate>Hak Cipta Hege Refsnes</FooterTemplate></asp:DataList></form></body></html>Gunakan <AlternatingItemTemplate>
Anda dapat menambahkan elemen <AlternatingItemTemplate> setelah elemen <ItemTemplate> untuk mendeskripsikan tampilan baris bergantian dalam output. Anda dapat menambahkan gaya ke data di area <AlternatingItemTemplate> di dalam kontrol DataList:
Contoh
<%@ Impor Namespace="System.Data" %><script runat="server">sub Page_Loadif Bukan Page.IsPostBack laludim mycdcatalog=New DataSetmycdcatalog.ReadXml(MapPath("cdcatalog.xml"))cdcatalog.DataSource=mycdcatalogcdcatalog. DataBind()end ifend sub</script><html><body><form runat="server"><asp:DataList id=”cdcatalog”runat=”server”cellpadding=”2”cellspacing=”2”borderstyle=”inset”backcolor=”#e8e8e8”headerstyle-font-name=”Verdana”headerstyle-font-size=”12pt”headerstyle -horizontalalign="center"headerstyle-font-bold="Tr ue"itemstyle-backcolor="#778899"itemstyle-forecolor="#ffffff"alternatingitemstyle-backcolor="#e8e8e8"alternatingitemstyle-forecolor="#000000"footerstyle-font-size="9pt"footerstyle-font-italic=" Benar"><HeaderTemplate>My Katalog CD</HeaderTemplate><ItemTemplate>"<%#Container.DataItem("title")%>" dari<%#Container.DataItem("artist")%> -$<%#Container.DataItem("price" )%></ItemTemplate><AlternatingItemTemplate>"<%#Container.DataItem("title")%>" of<%#Container.DataItem("artist")%> -$<%#Container.DataItem("price")%></AlternatingItemTemplate><FooterTemplate>© Hege Refsnes</FooterTemplate></asp:DataList>< /form></body></html>