DataList Web 伺服器控制項宣告式語法
更新：2007 年 11 月
使用樣板從資料來源顯示項目。您可以操作構成 DataList 控制項之不同元件的樣板 (例如 ItemTemplate 和 HeaderTemplate) 來自訂控制項的外觀和內容。
<asp:DataList
AccessKey="string"
BackColor="color name|#dddddd"
BorderColor="color name|#dddddd"
BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|Groove|Ridge|
Inset|Outset"
BorderWidth="size"
Caption="string"
CaptionAlign="NotSet|Top|Bottom|Left|Right"
CellPadding="integer"
CellSpacing="integer"
CssClass="string"
DataKeyField="string"
DataMember="string"
DataSource="string"
DataSourceID="string"
EditItemIndex="integer"
Enabled="True|False"
EnableTheming="True|False"
EnableViewState="True|False"
ExtractTemplateRows="True|False"
Font-Bold="True|False"
Font-Italic="True|False"
Font-Names="string"
Font-Overline="True|False"
Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|Medium|
Large|X-Large|XX-Large"
Font-Strikeout="True|False"
Font-Underline="True|False"
ForeColor="color name|#dddddd"
GridLines="None|Horizontal|Vertical|Both"
Height="size"
HorizontalAlign="NotSet|Left|Center|Right|Justify"
ID="string"
OnCancelCommand="CancelCommand event handler"
OnDataBinding="DataBinding event handler"
OnDeleteCommand="DeleteCommand event handler"
OnDisposed="Disposed event handler"
OnEditCommand="EditCommand event handler"
OnInit="Init event handler"
OnItemCommand="ItemCommand event handler"
OnItemCreated="ItemCreated event handler"
OnItemDataBound="ItemDataBound event handler"
OnLoad="Load event handler"
OnPreRender="PreRender event handler"
OnSelectedIndexChanged="SelectedIndexChanged event handler"
OnUnload="Unload event handler"
OnUpdateCommand="UpdateCommand event handler"
RepeatColumns="integer"
RepeatDirection="Horizontal|Vertical"
RepeatLayout="Table|Flow"
runat="server"
SelectedIndex="integer"
ShowFooter="True|False"
ShowHeader="True|False"
SkinID="string"
Style="string"
TabIndex="integer"
ToolTip="string"
UseAccessibleHeader="True|False"
Visible="True|False"
Width="size"
>
<AlternatingItemStyle />
<AlternatingItemTemplate>
<!-- child controls -->
</AlternatingItemTemplate>
<EditItemStyle />
<EditItemTemplate>
<!-- child controls -->
</EditItemTemplate>
<FooterStyle />
<FooterTemplate>
<!-- child controls -->
</FooterTemplate>
<HeaderStyle />
<HeaderTemplate>
<!-- child controls -->
</HeaderTemplate>
<ItemStyle />
<ItemTemplate>
<!-- child controls -->
</ItemTemplate>
<SelectedItemStyle />
<SelectedItemTemplate>
<!-- child controls -->
</SelectedItemTemplate>
<SeparatorStyle />
<SeparatorTemplate>
<!-- child controls -->
</SeparatorTemplate>
</asp:DataList>
備註
您可以定義樣板來操縱控制項的配置和內容。下表所列是 DataList 控制項的不同樣板。
類似於 ItemTemplate 項目，但是在 DataList 控制項中是以每隔一列 (替代列) 的方式呈現。您也可以設定 AlternatingItemTemplate 項目的樣式屬性將不同的外觀指定給它。 |
|
項目被設定為編輯模式時的配置。這個樣板通常會包含編輯控制項 (例如 TextBox 控制項)。當 EditItemIndex 設定為資料列的序數時，便會叫用 (Invoke) DataList 控制項中該資料列的 EditItemTemplate。 |
|
要呈現在 DataList 控制項底部 (行尾) 的文字和控制項。 無法繫結 FooterTemplate 的資料。 |
|
要呈現在 DataList 控制項頂端 (行首) 的文字和控制項。 無法繫結 HeaderTemplate 的資料。 |
|
要對資料來源中每一資料列呈現一次的項目。 |
|
使用者在 DataList 控制項中選取項目時要呈現的項目。通常是用來展開顯示的資料欄位數目，以及利用反白顯示以視覺化方式標記資料列。 |
|
要呈現在每一項目間的項目。 無法繫結 SeparatorTemplate 的資料。 |
您可以指定控制項不同部分的樣式來自訂 DataList 控制項的外觀。下表所列為控制 DataList 控制項不同部分之外觀的樣式屬性。
樣式屬性 |
說明 |
樣式類別 |
|---|---|---|
每隔一個項目 (替代項目) 的樣式。 |
||
編輯中項目的樣式。 |
||
位於清單結尾的行尾樣式 (如果有)。 |
||
位於清單開頭的行首樣式 (如果有)。 |
||
個別項目的樣式。 |
||
所選取項目的樣式。 |
||
每一項目間分隔符號的樣式。 |
.gif "注意事項") 注意事項： |
|---|
DataList 控制項和 Repeater 控制項不同之處在於支援有方向性的呈現 (藉由 RepeatColumns 和 RepeatDirection 屬性的使用)，以及在 HTML 表格中呈現的選項。 |
Items 集合含有 DataList 控制項的資料繫結成員。在 DataList 控制項上呼叫 DataBind 方法時，就會填入這個集合。首先會加入行首 (如果有)，然後對每一資料列加入一個 Item 物件。如果 SeparatorTemplate 存在，則會建立 Separators 並加入至項目之間，但是這些不會加入至 Items 集合。
在所有的項目已針對 DataSource 中的列建立後，Footer 會加入至控制項 (但是不會加入至 Items 集合)。最後，控制項會對每一項目 (包括行首、行尾和分隔符號) 引發 ItemCreated 事件。不像大多數的集合，Items 集合不會公開 (Expose) Add 或 Remove 方法。不過，您可以提供 ItemCreated 事件的事件處理常式來修改項目中的內容。
.gif "注意事項") 警告： |
|---|
尚未顯示於 DataList 控制項中的文字，便還未經過 HTML 編碼。這樣便可以在文字中的 HTML 標記內嵌入指令碼。如果控制項的值來自使用者輸入，請務必驗證值來協助防止安全性的弱點。 |
如需 DataList Web 伺服器控制項之屬性和事件的詳細資訊，請參閱 DataList 類別文件。
範例
下列範例將示範如何使用 DataList 控制項，顯示資料來源中的項目。
<%@ Page Language="VB" AutoEventWireup="True" %>
<%@ Import Namespace="System.Data" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<script runat="server">
Function CreateDataSource() As ICollection
' Create sample data for the DataList control.
Dim dt As DataTable = New DataTable()
dim dr As DataRow
' Define the columns of the table.
dt.Columns.Add(New DataColumn("IntegerValue", GetType(Int32)))
dt.Columns.Add(New DataColumn("StringValue", GetType(String)))
dt.Columns.Add(New DataColumn("CurrencyValue", GetType(Double)))
dt.Columns.Add(New DataColumn("ImageValue", GetType(String)))
' Populate the table with sample values.
Dim i As Integer
For i = 0 To 8
dr = dt.NewRow()
dr(0) = i
dr(1) = "Description for item " & i.ToString()
dr(2) = 1.23 * (i + 1)
dr(3) = "Image" & i.ToString() & ".jpg"
dt.Rows.Add(dr)
Next i
Dim dv As DataView = New DataView(dt)
Return dv
End Function
Sub Page_Load(sender As Object, e As EventArgs)
' Load sample data only once, when the page is first loaded.
If Not IsPostBack Then
ItemsList.DataSource = CreateDataSource()
ItemsList.DataBind()
End If
End Sub
</script>
<head runat="server">
<title>DataList Example</title>
</head>
<body>
<form id="form1" runat="server">
<h3>DataList Example</h3>
<asp:DataList id="ItemsList"
BorderColor="black"
CellPadding="5"
CellSpacing="5"
RepeatDirection="Vertical"
RepeatLayout="Table"
RepeatColumns="3"
runat="server">
<HeaderStyle BackColor="#aaaadd">
</HeaderStyle>
<AlternatingItemStyle BackColor="Gainsboro">
</AlternatingItemStyle>
<HeaderTemplate>
List of items
</HeaderTemplate>
<ItemTemplate>
Description: <br />
<%# DataBinder.Eval(Container.DataItem, "StringValue") %>
<br />
Price: <%# DataBinder.Eval(Container.DataItem, "CurrencyValue", "{0:c}") %>
<br />
<asp:Image id="ProductImage" AlternateText="Product picture"
ImageUrl='<%# DataBinder.Eval(Container.DataItem, "ImageValue") %>'
runat="server"/>
</ItemTemplate>
</asp:DataList>
</form>
</body>
</html>
<%@ Page Language="C#" AutoEventWireup="True" %>
<%@ Import Namespace="System.Data" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<script runat="server">
ICollection CreateDataSource()
{
// Create sample data for the DataList control.
DataTable dt = new DataTable();
DataRow dr;
// Define the columns of the table.
dt.Columns.Add(new DataColumn("IntegerValue", typeof(Int32)));
dt.Columns.Add(new DataColumn("StringValue", typeof(String)));
dt.Columns.Add(new DataColumn("CurrencyValue", typeof(double)));
dt.Columns.Add(new DataColumn("ImageValue", typeof(String)));
// Populate the table with sample values.
for (int i = 0; i < 9; i++)
{
dr = dt.NewRow();
dr[0] = i;
dr[1] = "Description for item " + i.ToString();
dr[2] = 1.23 * (i + 1);
dr[3] = "Image" + i.ToString() + ".jpg";
dt.Rows.Add(dr);
}
DataView dv = new DataView(dt);
return dv;
}
void Page_Load(Object sender, EventArgs e)
{
// Load sample data only once, when the page is first loaded.
if (!IsPostBack)
{
ItemsList.DataSource = CreateDataSource();
ItemsList.DataBind();
}
}
</script>
<head runat="server">
<title>DataList Example</title>
</head>
<body>
<form id="form1" runat="server">
<h3>DataList Example</h3>
<asp:DataList id="ItemsList"
BorderColor="black"
CellPadding="5"
CellSpacing="5"
RepeatDirection="Vertical"
RepeatLayout="Table"
RepeatColumns="3"
runat="server">
<HeaderStyle BackColor="#aaaadd">
</HeaderStyle>
<AlternatingItemStyle BackColor="Gainsboro">
</AlternatingItemStyle>
<HeaderTemplate>
List of items
</HeaderTemplate>
<ItemTemplate>
Description: <br />
<%# DataBinder.Eval(Container.DataItem, "StringValue") %>
<br />
Price: <%# DataBinder.Eval(Container.DataItem, "CurrencyValue", "{0:c}") %>
<br />
<asp:Image id="ProductImage" AlternateText="Product picture"
ImageUrl='<%# DataBinder.Eval(Container.DataItem, "ImageValue") %>'
runat="server"/>
</ItemTemplate>
</asp:DataList>
</form>
</body>
</html>