Web ページのチュートリアルlogin
Web ページのチュートリアル
著者:php.cn  更新時間:2022-04-11 14:20:28

Webフォームデータリスト


ASP.NET Web フォーム - DataList コントロール


DataList コントロールは、Repeater コントロールと同様に、コントロールにバインドされた項目の繰り返しリストを表示するために使用されます。ただし、DataList コントロールは、デフォルトでデータ項目にテーブルを追加します。


DataSet を DataList コントロールにバインドする

DataList コントロールは、Repeater コントロールと同様に、コントロールにバインドされた項目の繰り返しリストを表示するために使用されます。ただし、DataList コントロールは、デフォルトでデータ項目にテーブルを追加します。 DataList コントロールは、データベース テーブル、XML ファイル、またはその他の項目リストにバインドできます。ここでは、XML ファイルを DataList コントロールにバインドする方法を示します。

この例では、次の XML ファイル (「cdcatalog.xml」) を使用します:

<?xml version="1.0" encoding="ISO-8859-1"?>

< ;catalog> ;
<cd>
<title>エンパイア バーレスク</title>
<アーティスト>ボブ・ディラン</アーティスト>
<国>アメリカ</国>
<会社>コロンビア</会社>
<価格>10.90
<年>1985</年>
</cd>
<cd>
<title>心を隠してください</title>
<アーティスト>ボニー・タイラー</アーティスト>
<国>英国</国>
<会社>CBSレコード</会社>
<価格>9.90
<年>1988</年>
</cd>
<cd>
<title>グレイテスト ヒッツ</title>
<アーティスト>ドリー・パートン</アーティスト>
<国>アメリカ</国>
<会社>RCA</会社>
<価格>9.90
<年>1982</年>
</cd>
<cd>
<title>まだ憂鬱です</title>
<アーティスト>ゲイリー・ムーア</アーティスト>
<国>英国</国>
<会社>ヴァージンレコード</会社>
<価格>10.20
<年>1990年</年>
</cd>
<cd>
<title>エロス</title>
<アーティスト>エロス・ラマゾッティ</アーティスト>
<国>EU</国>
<会社>BMG</会社>
<価格>9.90
<year>1997</year>
</cd>
</catalog>

この XML ファイルを表示します: cdcatalog.xml

まず、「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=新しいデータセット
​ mycdcatalog.ReadXml(MapPath("cdcatalog.xml"))
end if
end sub

次に、.aspx ページに DataList コントロールを作成します。 <HeaderTemplate> 要素のコンテンツは最初にレンダリングされ、出力に 1 回だけ表示されますが、<ItemTemplate> 要素のコンテンツは DataSet の「レコード」ごとに繰り返され、最後に <ItemTemplate 要素のコンテンツが繰り返し表示されます。 FooterTemplate> 要素 の内容は出力に 1 回だけ表示されます:

<html>
<body>

<form runat="server">
<asp:DataList id="cdcatalog" runat= "server"&gt;

&lt; headertemplate&gt;
...&lt;/headertemplate&gt;

&lt; itemtemplate&gt;
...
&lt;/itemtemplate&gt;

&lt; footertemplate&gt; /FooterTemplate>

</asp:DataList>
</form>

</body>
</html>


次に、DataSet を作成し、mycdcatalog DataSet をバインドするスクリプトを追加します。 DataList コントロール。それから DataList コントロールに、ヘッダーを含む <HeaderTemplate> 、表示するデータ項目を含む <ItemTemplate> 、およびテキストを含む <FooterTemplate> を設定します。 DataList の Gridlines プロパティを "both" に設定すると、テーブルの境界線を表示できることに注意してください:

Example

<%@ 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>

<!DOCTYPE html>
<html>
<body>

<form runat="server">
<asp:DataList
id="cdcatalog"
gridlines="Both"
runat="server">

<HeaderTemplate>
My CD Catalog
</HeaderTemplate>

<ItemTemplate>
"<%#Container.DataItem("title")%>" of <%#Container.DataItem("artist")%>  - $<%#Container.DataItem("price")%>
</ItemTemplate>

<FooterTemplate>
© Hege Refsnes
</FooterTemplate>

</asp:DataList>
</form>

</body>
</html>

サンプルの実行»

オンラインサンプルを表示するには、「サンプルの実行」ボタンをクリックしてください

スタイルを使用する

DataList コントロールにスタイルを追加して、出力をより派手にすることもできます:

Instance

<%@ 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>

<!DOCTYPE html>
<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>
My CD Catalog
</HeaderTemplate>

<ItemTemplate>
"<%#Container.DataItem("title")%>" of <%#Container.DataItem("artist")%>  - $<%#Container.DataItem("price")%>
</ItemTemplate>

<FooterTemplate>
© Hege Refsnes
</FooterTemplate>

</asp:DataList>
</form>

</body>
</html>

Run Instance»

[Run Instance] ボタンをクリックして、オンライン例を表示します。

<AlternatingItemTemplate> の使用

<ItemTemplate> 要素の後に <AlternatingItemTemplate> 要素を追加して、出力内の交互の行の外観を記述することができます。 DataList コントロール内の <AlternatingItemTemplate> 領域のデータにスタイルを追加できます:

Instance

<%@ 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>

<!DOCTYPE html>
<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>
My CD Catalog
</HeaderTemplate>

<ItemTemplate>
"<%#Container.DataItem("title")%>" of <%#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>

Run Instance »

[Run Instance] ボタンをクリックしてオンライン インスタンスを表示します