WebForm Repeater使用
Repeater：
HeaderTemplate： 在加载开始执行一遍
ItemTemplate ： 有多少条数据，执行多少遍
FooterTemplate ：在加载最后执行一遍
AlternatingItemTemplate ： 交替项模板
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<asp:Repeater ID="Repeater1" runat="server">
<HeaderTemplate>
<table style="background-color:navy;text-align:center">
<tr style="color:white;padding:10px;">
<td>UserName</td>
<td>PsssWord</td>
<td>NickName</td>
<td>Sex</td>
<td>Birthday</td>
<td>Nation</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color:yellow">
<td><%#Eval("UserName")%></td>
<td><%#Eval("PassWord")%></td>
<td><%#Eval("NickName")%></td>
<td><%#Eval("Sex")%></td>
<td><%#Eval("birthday")%></td>
<td><%#Eval("Nation")%></td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</form>
</body>
</html>
数据绑定
protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { Repeater1.DataSource = new UsersDA().Select(); Repeater1.Users：
/// <summary> /// 性别 /// </summary> public bool Sex { get { return _Sex; } set { _Sex = value; } } public string SexStr { get { return _Sex ? "男" : "女"; } } private DateTime _Birthday; /// <summary> /// 生日 /// </summary> public DateTime Birthday { get { return _Birthday; } set { _Birthday = value; } } public string BirthdayStr { get { return _Birthday.ToString("yyyy年MM月dd日"); } } private string _Nation; /// <summary> /// 民族 /// </summary> public string Nation { get { return _Nation; } set { _Nation = value; } } public string NationName { get { return new NationData().Select(this._Nation).NationName; } } public string Age { get { return (DateTime.Now.Year - this._Birthday.Year).ToString(); } } public string Red { get { string end = ""; if (Convert.ToInt32(Age) >= 16) { end = "background-color:red;"; } return end; } }
数据操作类
public class UsersDA { SqlConnection conn = null; SqlCommand cmd = null; public UserDA() { conn = new SqlConnection("server=.;database=Data0617;user=sa;pwd=123"); cmd = conn.CreateCommand(); } public List<Users> select() { List<Users> list = new List<Users>(); cmd.CommandText = "select * from Users"; conn.Open(); SqlDataReader dr = cmd.ExecuteReader(); if (dr.HasRows) { while (dr.Read()) { Users data = new Users(); data.UserName = dr[0].ToString(); data.Password = dr[1].ToString(); data.NickName = dr[2].ToString(); data.Sex =Convert.ToBoolean( dr[3]) ; data.Birthday = Convert.ToDateTime(dr[4]); data.Nation = dr[5].ToString(); list.Add(data); } } conn.Close(); return list; } }
库存预警
通过某个属性值判断后，将某条数据的样式进行更改
属性扩展的方式，写一个返回string类型的属性，返回的是CSS样式表样式
为了让大家知道，属性值不一定非得是展示用
<ItemTemplate>
<tr class="tr_Item" style="<%#Eval("Red")%>">
<td><%#Eval("UserName") %></td>
<td><%#Eval("PassWord") %></td>
<td><%#Eval("NickName") %></td>
<td><%#Eval("SexStr") %></td>
<td><%#Eval("BirthdayStr") %></td>
<td><%#Eval("Age") %></td>
<td><%#Eval("NationName") %></td>
</tr>
</ItemTemplate>
光棒效果
鼠标移入改变颜色
<style type="text/css"> #tb1 { width: 100%; background-color: navy; text-align: center; } #tr_head { color: white; } .tr_Item { background-color: white; } .tr_Item2 { background-color: #e0e0e0; } </style> <script type="text/javascript"> window.onload = function () { var items = document.getElementsByClassName("tr_Item"); var oldColor = ""; for (var i = 0; i < items.length; i++) { items[i].onmouseover = function () { oldColor = this.style.backgroundColor; this.style.backgroundColor = "yellow"; }; items[i].onmouseout = function () { this.style.backgroundColor = oldColor; }; } }; </script>
