DataListWeb服务器控件
通过使用模板显示数据源中的项。通过操作组成DataList控件的不同组件的模板(如ItemTemplate和HeaderTemplate),可以自定义该控件的外观和内容。
<asp:DataListid="DataList1"
CellPadding="pixels"
CellSpacing="pixels"
DataKeyField="DataSourceKeyField"
DataSource='<%databindingexpression%>'
ExtractTemplateRows="True|False"
GridLines="None|Horizontal|Vertical|Both"
RepeatColumns="ColumnCount"
RepeatDirection="Vertical|Horizontal"
RepeatLayout="Flow|Table"
ShowFooter="True|False"
ShowHeader="True|False"
OnCancelCommand="OnCancelCommandMethod"
OnDeleteCommand="OnDeleteCommandMethod"
OnEditCommand="OnEditCommandMethod"
OnItemCommand="OnItemCommandMethod"
OnItemCreated="OnItemCreatedMethod"
OnUpdateCommand="OnUpdateCommandMethod"
runat="server">
<AlternatingItemStyleForeColor="Blue"/>
<EditItemStyleBackColor="Yellow"/>
<FooterStyleBorderColor="Gray"/>
<HeaderStyleBorderColor="Gray"/>
<ItemStyleFont-Bold="True"/>
<PagerStyleFont-Name="Ariel"/>
<SelectedItemStyleBackColor="Blue"/>
<HeaderTemplate>
HeadertemplateHTML
</HeaderTemplate>
<ItemTemplate>
ItemtemplateHTML
</ItemTemplate>
<AlternatingItemTemplate>
AlternatingitemtemplateHTML
</AlternatingItemTemplate>
<EditItemTemplate>
EditeditemtemplateHTML
</EditItemTemplate>
<SelectedItemTemplate>
SelecteditemtemplateHTML
</SelectedItemTemplate>
<SeparatorTemplate>
SeparatortemplateHTML
</SeparatorTemplate>
<FooterTemplate>
FootertemplateHTML
</FooterTemplate>
</asp:DataList>
备注
通过定义模板,可以操作控件的布局和内容。下表列出DataList控件的不同模板。
AlternatingItemTemplate类似于ItemTemplate元素,但在DataList控件中隔行(交替行)呈现。通过设置AlternatingItemTemplate元素的样式属性,可以为其指定不同的外观。
EditItemTemplate项在设置为编辑模式后的布局。此模板通常包含编辑控件(如TextBox控件)。当EditItemIndex设置为DataList控件中某一行的序号时,将为该行调用EditItemTemplate。
FooterTemplate在DataList控件的底部(脚注)呈现的文本和控件。
FooterTemplate不能是数据绑定的。
HeaderTemplate在DataList控件顶部(标头)呈现的文本和控件。
HeaderTemplate不能是数据绑定的。
ItemTemplate为数据源中的每一行都呈现一次的元素。
SelectedItemTemplate当用户选择DataList控件中的一项时呈现的元素。通常的用法是增加所显示的数据字段的个数并以可视形式突出标记该行。
SeparatorTemplate在各项之间呈现的元素。
SeparatorTemplate项不能是数据绑定的。
通过为DataList控件的不同部分指定样式,可以自定义该控件的外观。下表列出用于控制DataList控件不同部分的外观的样式属性。
样式属性说明样式类
AlternatingItemStyle隔项(交替项)的样式。TableItemStyle
EditItemStyle正在编辑的项的样式。TableItemStyle
FooterStyle列表结尾处的脚注(如果有的话)的样式。TableItemStyle
HeaderStyle列表开始处的标头(如果有的话)的样式。TableItemStyle
ItemStyle单个项的样式。Style
SelectedItemStyle选定项的样式。TableItemStyle
SeparatorStyle各项之间的分隔符的样式。TableItemStyle
注意DataList控件与Repeater控件的不同之处在于,前者支持定向呈现(通过使用RepeatColumns和RepeatDirection属性)并且有用于在HTML表内呈现的选项。
Items集合包含DataList控件的数据绑定成员。当在DataList控件上调用DataBind方法时该集合将被填充。首先添加标头(如果有的话),然后为每个数据行添加一个Item对象。如果存在SeparatorTemplate,则Separators将被创建并添加到各项之间,但不会添加到Items集合中。
在为DataSource中的行创建所有项之后,Footer被添加到该控件中(但不会添加到Items集合中)。最后,该控件为每一项(包括标头、脚注和分隔符)引发ItemCreated事件。与大多数集合不同,Items集合不公开Add或Remove方法。但是,可以通过为ItemCreated事件提供处理程序来修改项内的内容。
警告文本在DataList控件中显示之前并非HTML编码形式。这使得可以在文本中的HTML标记间嵌入脚本。如果控件值是用户输入的,请务必验证这些值以防止出现安全漏洞。
有关DataListWeb服务器控件的属性和事件的详细信息,请参见DataList类文档。
示例
以下示例说明如何使用DataList控件显示数据源中的项。
[VisualBasic]
<%@PageLanguage="VB"AutoEventWireup="True"%>
<%@ImportNamespace="System.Data"%>
<html>
<scriptrunat="server">
FunctionCreateDataSource()AsICollection
DimdtAsNewDataTable()
DimdrAsDataRow
dt.Columns.Add(NewDataColumn("StringValue",GetType(String)))
DimiAsInteger
Fori=0To9
dr=dt.NewRow()
dr(0)="Item"&i.ToString()
dt.Rows.Add(dr)
Nexti
DimdvAsNewDataView(dt)
Returndv
EndFunction'CreateDataSource
SubPage_Load(senderAsObject,eAsEventArgs)
IfNotIsPostBackThen
DataList1.DataSource=CreateDataSource()
DataList1.DataBind()
EndIf
EndSub'Page_Load
SubButton1_Click(senderAsObject,eAsEventArgs)
IfDropDown1.SelectedIndex=0Then
DataList1.RepeatDirection=RepeatDirection.Horizontal
Else
DataList1.RepeatDirection=RepeatDirection.Vertical
EndIf
IfDropDown2.SelectedIndex=0Then
DataList1.RepeatLayout=RepeatLayout.Table
Else
DataList1.RepeatLayout=RepeatLayout.Flow
EndIf
DataList1.RepeatColumns=DropDown3.SelectedIndex+1
IfCheck1.Checked=TrueAndDataList1.RepeatLayout=RepeatLayout.TableThen
DataList1.BorderWidth=Unit.Pixel(1)
DataList1.GridLines=GridLines.Both
Else
DataList1.BorderWidth=Unit.Pixel(0)
DataList1.GridLines=GridLines.None
EndIf
EndSub'Button1_Click
</script>
<body>
<formrunat="server">
<h3>DataListExample</h3>
<asp:DataListid="DataList1"runat="server"
BorderColor="black"
CellPadding="3"
Font-Name="Verdana"
Font-Size="8pt">
<HeaderStyleBackColor="#aaaadd">
</HeaderStyle>
<AlternatingItemStyleBackColor="Gainsboro">
</AlternatingItemStyle>
<HeaderTemplate>
Items
</HeaderTemplate>
<ItemTemplate>
<%#DataBinder.Eval(Container.DataItem,"StringValue")%>
</ItemTemplate>
</asp:DataList>
<p>
<hrnoshadealign="left"width="300px">
RepeatDirection:
<asp:DropDownListid=DropDown1runat="server">
<asp:ListItem>Horizontal</asp:ListItem>
<asp:ListItem>Vertical</asp:ListItem>
</asp:DropDownList><br>
RepeatLayout:
<asp:DropDownListid=DropDown2runat="server">
<asp:ListItem>Table</asp:ListItem>
<asp:ListItem>Flow</asp:ListItem>
</asp:DropDownList><br>
RepeatColumns:
<asp:DropDownListid=DropDown3runat="server">
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
</asp:DropDownList><br>
ShowBorders:
<asp:CheckBoxid=Check1runat="server"/><p>
<asp:LinkButtonid=Button1
Text="RefreshDataList"
OnClick="Button1_Click"
runat="server"/>
</form>
</body>
</html>
[C#]
<%@PageLanguage="C#"AutoEventWireup="True"%>
<%@ImportNamespace="System.Data"%>
<html>
<scriptrunat="server">
ICollectionCreateDataSource()
{
DataTabledt=newDataTable();
DataRowdr;
dt.Columns.Add(newDataColumn("StringValue",typeof(string)));
for(inti=0;i<10;i++)
{
dr=dt.NewRow();
dr[0]="Item"+i.ToString();
dt.Rows.Add(dr);
}
DataViewdv=newDataView(dt);
returndv;
}
voidPage_Load(ObjectSender,EventArgse)
{
if(!IsPostBack)
{
DataList1.DataSource=CreateDataSource();
DataList1.DataBind();
}
}
voidButton1_Click(ObjectSender,EventArgse)
{
if(DropDown1.SelectedIndex==0)
DataList1.RepeatDirection=RepeatDirection.Horizontal;
else
DataList1.RepeatDirection=RepeatDirection.Vertical;
if(DropDown2.SelectedIndex==0)
DataList1.RepeatLayout=RepeatLayout.Table;
else
DataList1.RepeatLayout=RepeatLayout.Flow;
DataList1.RepeatColumns=DropDown3.SelectedIndex+1;
if((Check1.Checked==true)&&
(DataList1.RepeatLayout==RepeatLayout.Table))
{
DataList1.BorderWidth=Unit.Pixel(1);
DataList1.GridLines=GridLines.Both;
}
else
{
DataList1.BorderWidth=Unit.Pixel(0);
DataList1.GridLines=GridLines.None;
}
}
</script>
<body>
<formrunat="server">
<h3>DataListSample</h3>
<asp:DataListid="DataList1"
BorderColor="black"
CellPadding="3"
Font-Name="Verdana"
Font-Size="8pt"
runat="server">
<HeaderStyleBackColor="#aaaadd"/>
<AlternatingItemStyleBackColor="Gainsboro"/>
<HeaderTemplate>
Items
</HeaderTemplate>
<ItemTemplate>
<%#DataBinder.Eval(Container.DataItem,"StringValue")%>
</ItemTemplate>
</asp:DataList>
<p>
<hrnoshadealign="left"width="300px">
RepeatDirection:
<asp:DropDownListid=DropDown1runat="server">
<asp:ListItem>Horizontal</asp:ListItem>
<asp:ListItem>Vertical</asp:ListItem>
</asp:DropDownList><br>
RepeatLayout:
<asp:DropDownListid=DropDown2runat="server">
<asp:ListItem>Table</asp:ListItem>
<asp:ListItem>Flow</asp:ListItem>
</asp:DropDownList><br>
RepeatColumns:
<asp:DropDownListid=DropDown3runat="server">
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
</asp:DropDownList><br>
ShowBorders:
<asp:CheckBoxid=Check1runat="server"/>
<p>
<asp:LinkButtonid=Button1
Text="RefreshDataList"
OnClick="Button1_Click"
runat="server"/>
</font>
</form>
</body>
</html>
请参见