设计模版:
页眉<HeaderTemplate>
页脚<FooterTemplate>
</FooterTemplate>
数据记录<ItemTemplate>
</ItemTemplate>
<AlternatingItemTemplate> 交替显示项
</AlternatingItemTemplate>
<SelectedItemTemplate>选中时的显示方式
</SelectedItemTemplate>
<EditItemTemplate> 编辑时的显示方式
</EditItemTemplate>
<SeparatorTemplate> 数据记录分隔符
</SeparatorTemplate>
编辑模版,里面可以嵌入控件,绑定数据。
<ItemTemplate>
<table>
<tr>
<td><%# DataBinder.Eval(Container.DataItem, "持股名称") %></td>
<td><%# DataBinder.Eval(Container.DataItem, "市值", "{0:n}") %></td>
<td><%# DataBinder.Eval(Container.DataItem, "净值", "{0:n}") %></td>
</tr>
</table>
</ItemTemplate>
设置外观
RepeatLayout 属性设置显示方式
RepeatDirection 显示方向
RepeatColumns 列数
在DataList中显示记录时,authors表中每行都显示在独立的HTML表格中,只要你愿意,也可以修改其RepeatLayout属性把DataList的项显示在HTML的<div></div>中。在默认情况下,RepeatLayout属性值为Table。如果把RepeatLayout属性设为Flow,那么每个项就显示在<div></div>中。
<asp:DataList RepeatLayout=”Flow” Runat=”Server”>
当RepeatLayout属性为Table时,通过设置GridLines属性可以在每个单元格周围显示线条。GridLines属性可选值有: Both / Horizontal / Vertical
DataList的一个好处的特征是可以以多个列显示数据现。通过设置其RepeatColumns和RepeatDirection属性,可以控制DataList的列的布局。
RepeatColumns属性决定要显示的列的数量。比如,如果要在DataList中显示四列的项,那么可以把这个属性设为4。
RepeatDirection属性句顶列是按水平或垂直方向来重复。在默认情况下,RepeatDirection值为Vertical,因此,如果RepeatColumns值为4,则列就像这样显示:
Column 1 Column3 Column5 Column7
Column 2 Column4 Column6 Column8
如果把RepeatDirection设为Horizontal,而且RepeatColumns值为4,那么列就像这样显示:
Column 1 Column3 Column5 Column7
Column 2 Column4 Column6 Column8
注意,即使RepeatDirection值为Vertical,还是显示为4个列。RepeatColumns永远是指重复的列的数量,而不是行的数量。
加入模版列的按钮会将其click事件反升到 ItemCommand 事件,也可设置 CommandName
来响应不同的事件,如设为:edit,即引发EditCommand()等。
在ASP.NET中有三个控件带有CommandName属性,分别是Button、LinkButton和ImageButton,可以设置它们的CommandName属性来表示容器控件内产生的时间类型。
1) EditCommand:由带有CommandName=”edit”的子控件产生
2) CancelCommand:由带有CommandName=”cancel”的子控件产生
3) UpdateCommand:由带有CommandName=”update”的子控件产生
4) DeleteCommand:由带有CommandName=”delete”的子控件产生
5) ItemCommand:DataList的默认事件
响应顺序为先响应ItemCommand ,并判断其中的CommandName分别响应
如果有EditCommand\EditCommand\UpdateCommand\DeleteCommand后响应
SelectedItemTemplate模版; 添加详细信息的控件,当用户选择了该项,选择模版则显示。
private void DataList1_ItemCommand(……)
{ switch(e.CommandName)
{
case "select":
this.DataList1.SelectedIndex=e.Item.ItemIndex;
string s=(string)this.DataList1.DataKeys[e.Item.ItemIndex];
//在此获得该条记录的详细数据,在SelectedItemTemplate模版里显示。
break;
case "unselect":
this.DataList1.SelectedIndex=-1;
break;
}
this.DataList1.DataBind();//一定要
}
EditItemTemplate模版
编辑:
this.DataList1.EditItemIndex=e.Item.ItemIndex;
this.DataList1.DataBind();
更新:
得到主键
string s=(string)this.DataList1.DataKeys[e.Item.ItemIndex];
得到模版里的控件
TextBox box=(TextBox)e.Item.FindControl("TextBox1");
更新记录
this.DataList1.DataBind();
取消:
this.DataList1.EditItemIndex=-1;
this.DataList1.DataBind();
删除项
一次勾选多条记录,一次删除
foreach(DataListItem i in this.DataList1.Items)
{
bool IsChecked=((CheckBox)i.FindControl("deletectr")).Checked;
if(IsChecked)
{
string s=(string)this.DataList1.DataKeys[e.Item.ItemIndex];
删除操作 }
}
运行中自定义DataList控件
//当创建DataList控件中的任意项时
private void DataList1_ItemCreated(object sender, System.Web.UI.WebControls.DataListItemEventArgs e)
{
switch(e.Item.ItemType)
{ case ListItemType.Header:
e.Item.ForeColor=Color.Red;
e.Item.BackColor=Color.Black;
break;
case ListItemType.Item:
e.Item.BackColor=Color.Black;
break;
}
}
//当模版中的项被数据绑定时发生,数据被显示到客户端前加以访问的最后机会
private void DataList1_ItemDataBound(object sender, System.Web.UI.WebControls.DataListItemEventArgs e)
{
if((e.Item.ItemType==ListItemType.Header)||(e.Item.ItemType==ListItemType.Item))
{
System.Data.Common.DbDataRecord drv=
(System.Data.Common.DbDataRecord)e.Item.DataItem;
if((decimal)drv["库存量"]<1000)
{
e.Item.ForeColor=Color.Red;
}
}
}
另种方式
if((e.Item.ItemType==ListItemType.Header)||(e.Item.ItemType==ListItemType.Item))
{
DataRowView drv=(DataRowView)e.Item.DataItem;
string department=(string)drv["部门"];
switch(department)
{ case "销售部":
e.Item.BackColor=Color.Black;
break;
case "技术部":
e.Item.BackColor=Color.Red;
break; }
}
完整例子:
<asp:DataList ID="MyDL" runat="server">
<ItemStyle BackColor=AliceBlue />
<HeaderTemplate>
<div>头部</div><div>
</HeaderTemplate>
<SelectedItemTemplate>
名称:<%#DataBinder.Eval(Container.DataItem,"PicName")%>
路径:<%#DataBinder.Eval(Container.DataItem,"PicUrl")%>
</SelectedItemTemplate>
<EditItemTemplate>
<asp:TextBox ID="TextBox1" runat="server" Text='<%#DataBinder.Eval(Container.DataItem,"PicName")%>'></asp:TextBox>
<asp:Button ID="Button3" runat="server" Text="更新" CommandName="update" />
<asp:Button ID="Butto4" runat="server" Text="取消" CommandName="cancel" />
</EditItemTemplate>
<ItemTemplate>
<li>ID:<%#DataBinder.Eval(Container.DataItem,"PicID") %>
<asp:Button ID="Button2" runat="server" Text="修改" CommandName="edit" />
<asp:Button ID="Button1" runat="server" Text="删除" CommandName="delete" />
</li>
</ItemTemplate>
<FooterTemplate>
</div>
<div>底部</div>
</FooterTemplate>
</asp:DataList>
//================================================================================
CS文件,代码片段:
public class dida : System.Web.UI.Page
{
public SqlConnection myConn = new SqlConnection(ConfigurationSettings.AppSettings["ConnStr"]);
public Repeater MyRP = new Repeater();
public DataList MyDL = new DataList();
public Label MyLB;
public DataSet MyDS = new DataSet();
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
MyData();
MyLB.Text = "第一次加载";
}
else
{
MyLB.Text = "回调时加载";
}
}
private void MyData()
{
SqlDataAdapter MyDa = new SqlDataAdapter("select top 5 * from picdata", myConn);
MyDa.Fill(this.MyDS, "MyTable");
MyDL.DataSource = MyDS.Tables["MyTable"];
MyDL.DataBind();
}
override protected void OnInit(EventArgs e)
{
InitializeComponent();
base.OnInit(e);
}
private void InitializeComponent()
{
this.MyDL.EditCommand += new DataListCommandEventHandler(this.MyDL_EditCommand);
this.MyDL.UpdateCommand += new DataListCommandEventHandler(this.MyDL_UpdateCommand);
this.MyDL.CancelCommand += new DataListCommandEventHandler(this.MyDL_CancelCommand);
this.MyDL.DeleteCommand +=new DataListCommandEventHandler(this.MyDL_DeleteCommand);
this.Load += new System.EventHandler(this.Page_Load);
}
private void MyDL_EditCommand(object source, System.Web.UI.WebControls.DataListCommandEventArgs e)
{
MyDL.EditItemIndex = e.Item.ItemIndex;
MyDL.SelectedIndex = -1; //屏蔽已选的
MyData();
MyLB.Text = "修改";
}
private void MyDL_UpdateCommand(object source, System.Web.UI.WebControls.DataListCommandEventArgs e)
{
MyDL.EditItemIndex = -1;//屏蔽
MyDL.SelectedIndex = e.Item.ItemIndex;//更新后,设置被更新项为 已选项!
MyData();
MyLB.Text = "更新";
}
private void MyDL_CancelCommand(object source, System.Web.UI.WebControls.DataListCommandEventArgs e)
{
MyDL.EditItemIndex = -1;
MyDL.SelectedIndex = -1;
MyData();
MyLB.Text = "放弃更新";
}
private void MyDL_DeleteCommand(object source, System.Web.UI.WebControls.DataListCommandEventArgs e)
{
MyDL.EditItemIndex = -1;//屏蔽
MyData();
MyLB.Text = "删除";
}
}