Repeater 的使用
<HeaderTemplate></HeaderTemplate> 头模板——在加载开始执行一遍
<FooterTemplate></FooterTemplate> 脚模板——有多少条数据，执行多少遍
<ItemTemplate></ItemTemplate> 项模板——在加载最后执行一遍
<AlternatingItemTemplate></AlternatingItemTemplate> 交替展示模板
- 纯HTML+css+js制作
- 添加Repeater控件，将数据绑定展示
例子：
以China表为例数据展示：
<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>区域编号</td>
<td>区域名称</td>
<td>区域父级编号</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr style="background-color: #e0e0e0;">
<td><%#Eval("AreaCode") %></td>
<td><%#Eval("AreaName") %></td>
<td><%#Eval("ParentAreaCode") %></td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
</form>
</body>
.cs代码
//绑定数据
if (!IsPostBack)
{
Repeater1.DataSource = new ChinaStatesData().Select("");
Repeater1.DataBind(); }
China实体类
public class China
{
public China()
{ }
private string code; public string Code
{
get { return code; }
set { code = value; }
}
private string name; public string Name
{
get { return name; }
set { name = value; }
}
private string prentcode; public string Prentcode
{
get { return prentcode; }
set { prentcode = value; }
}
}
China数据操作类
public class ChinaData
{
SqlConnection conn = null;
SqlCommand cmd = null;
public ChinaData()
{
conn = new SqlConnection("server=.;database=mydb;user=sa;pwd=123");
cmd = conn.CreateCommand();
}
public List<China> Select(string pcode)
{
cmd.CommandText = "select * from ChinaStates where ParentAreaCode=@pcode";
cmd.Parameters.Clear();
cmd.Parameters.AddWithValue("@pcode", pcode); conn.Open(); SqlDataReader dr = cmd.ExecuteReader(); List<China> list = new List<China>(); if (dr.HasRows)
{
while (dr.Read())
{
China data = new China();
data.Code = dr[].ToString();
data.Name = dr[].ToString();
data.Prentcode = dr[].ToString(); list.Add(data);
}
} conn.Close(); return list;
}
}
------------------------------------------------------------------------------
以Users表作数据展示并作库存预警光棒效果:
<body>
<form id="form1" runat="server">
<asp:Repeater ID="Repeater1" runat="server">
<HeaderTemplate>
<table>
<tr>
<td>用户名</td>
<td>密码</td>
<td>昵称</td>
<td>性别</td>
<td>生日</td>
<td>民族</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td><%#Eval("UserName") %></td>
<td><%#Eval("Password") %></td>
<td><%#Eval("NickName") %></td>
<td><%#Eval("SexName") %></td>
<td><%#Eval("birthdayn" )%></td>
<td><%#Eval("NationName") %></td>
</tr>
</ItemTemplate>
<FooterTemplate></table> </FooterTemplate>
</asp:Repeater>
</form>
</body>
Users实体类：
public Users()
{ }
private string _UserName; public string UserName
{
get { return _UserName; }
set { _UserName = value; }
}
private string _Password; public string Password
{
get { return _Password; }
set { _Password = value; }
}
private string _NickName; public string NickName
{
get { return _NickName; }
set { _NickName = value; }
}
private bool _Sex; public bool Sex
{
get { return _Sex; }
set { _Sex = value; }
}
private DateTime _Birthday; public DateTime Birthday
{
get { return _Birthday; }
set { _Birthday = value; }
} private string _Nation; public string Nation
{
get { return _Nation; }
set { _Nation = value; }
}
public string SexName
{
get {
return this._Sex ? "男" : "女";
}
}
public string NationName
{
get
{
NationDA da = new NationDA();
_Nation = da.NationName(this.Nation);
return _Nation;
}
}
public string birthdayn
{
get
{
return this.Birthday.ToString("yyyy'年'M'月'd'日'");
}
}
UserDA数据操作类：
public class UserDA
{
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[].ToString();
data.Password = dr[].ToString();
data.NickName = dr[].ToString();
data.Sex =Convert.ToBoolean( dr[]) ;
data.Birthday = Convert.ToDateTime(dr[]);
data.Nation = dr[].ToString();
list.Add(data);
}
}
conn.Close(); return list;
} }
Nation实体类：
public class Nation
{
public Nation()
{ }
private string _NationCode; public string NationCode
{
get { return _NationCode; }
set { _NationCode = value; }
} private string _NationName; public string NationName
{
get { return _NationName; }
set { _NationName = value; }
}
}
NationDA数据操作类：
public class NationDA
{
SqlConnection conn = null;
SqlCommand cmd = null;
public NationDA()
{
conn = new SqlConnection("server=.;database=Data0617;user=sa;pwd=123");
cmd = conn.CreateCommand();
}
public string NationName(string ncode)
{
string name = "";
cmd.CommandText = "select NationName from Nation where NationCode=@ncode";
cmd.Parameters.Clear();
cmd.Parameters.AddWithValue("@ncode",ncode);
conn.Open();
SqlDataReader dr = cmd.ExecuteReader();
if (dr.HasRows)
{
Nation a = new Nation();
dr.Read();
name = dr[].ToString(); } conn.Close();
return name;
}
}
数据绑定
if (!IsPostBack)
{
Repeater1.DataSource = new UserDA().select();
Repeater1.DataBind(); }
-------------------------------------------------------------------------------
库存预警：
<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>
Users实体类，通过扩展属性
public string Age
{
get { return (DateTime.Now.Year - this._Birthday.Year).ToString(); }
} public string Red
{
get
{
string end = "";
if (Convert.ToInt32(Age) >= )
{
end = "background-color:red;";
}
return end;
}
}
光棒效果——鼠标移入移出颜色改变
<style type="text/css">
#tb1 {
width: %;
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 = ; 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>
Repeater 的使用的更多相关文章
- C# 在Repeater 的ItemDataBound 如何转换e.Item.DataItem 的类型
1.使用DataSet和DataTable绑定数据源时,用 DataRowView view = (DataRowView)e.Item.DataItem; 2.DataReader绑定数据源时,用 ...
- Webform（七）——内置对象（Session、Application）和Repeater的Command操作
内置对象:用于页面之间的数据交互 为什么要使用这么内置对象?因为HTTP的无状态性. 一.内置对象 (一)Session 跟Cookies一样用来存储用户数据 1.Session.Cookies对比 ...
- Webform（五）——内置对象（Response、Request）和Repeater中的数据增删改
一.内置对象 (一)Response对象 1.简介:response 对象在ASP中负责将信息传递给用户.Response对象用于动态响应客户端请求,并将动态生成的响应结果返回到客户端浏览器中,使用R ...
- webform Repeater重复器、地址栏传值、Response
Repeater: 重复器 <HeaderTemplate></HeaderTemplate> - 头模板:在循环开始时,其内容只会打印一遍 <ItemTemplate& ...
- Repeater、地址栏传值、Response--2016年12月30日
Repeater Repeater支持以下5种模板 ● ItemTemplate : 对每一个数据项进行格式设置 [Formats each item from the data sou ...
- C#中用radio单选Repeater循环数据,js实现
<asp:Repeater ID="rpt" runat="server"> <ItemTemplate> <tr data-id ...
- asp:Repeater实例备忘
1.前置部分 <asp:Repeater ID="rptPlanNo" runat="server" OnItemDataBound="rptP ...
- webform Repeater、地址栏传值、Response
Repeater: 重复器 Repeater中有五个模板,这里需要注意的是4个 <HeaderTemplate> - 开头,只执行一次的内容 <ItemTemplate> - ...
- ASP.NET中获取Repeater模板列中LinkButton按钮事件中获取ID等
前台页面中: <asp:Repeater ID="repComment" runat="server"> <ItemTe ...
- Repeater的分页
Repeater控件是个好东西.轻量级.又好用.完全的自定义.但是,正是因为这些优点它没有自动分页的功能.这个需要研究一下.我看了一下起点等小说网站,那些什么推荐排名榜用Repeater控件那是很 ...
随机推荐
- Unity UGUI——概述、长处
Unity4.6推出的新UI系统 长处:灵活.高速.可视化.效率高效果好.易于使用和扩展
- 1.5.4 HAVING子句
1.5.4 HAVING子句正在更新内容.请稍后
- jquery全选,取消全选
近期项目又用到了这个全选和取消全选的操作. 曾经总是自己写纯JS.如今既然知道怎么写了.那怎样用JQ写得更简洁呢.这样也能学到新的东西.假设乎百度一下果然发现了好东东.感谢OSC的iuhoay. 代码 ...
- Java数据类型的分类
java支持的类型分为两类:基本类型和引用类型 一.基本类型 4类8种: (1)整型:int.short.long.byte. (2)浮点型:float.double. (3)字符型:char. (4 ...
- [IMX6DL][Android4.4] 电池低电量告警提示【转】
本文转载自:http://blog.csdn.net/kris_fei/article/details/51789964 之前版本的电池电量低是通过发送 intent ACTION_BATTERY_L ...
- YTU 2893: F--Mark的双薪
2893: F--Mark的双薪 时间限制: 1 Sec 内存限制: 128 MB 提交: 230 解决: 17 题目描述 程序员 Mark 编制的 PPYU 游戏终于上线.Mark 认为自己起早 ...
- Serializable 接口与 Java 序列化与反序列化
0. 序列化的意义 从内存到本地即为本地化或者在网络中进行传输,或叫序列化,持久化. 某 Java 类实现 Serializable 接口的目的是为了可持久化(简单理解为本地化),比如网络传输或本地存 ...
- poyla计数问题
关于poyla定理,首先推荐两篇很好的文章阅读 2001-----符文杰<poyla原理及其应用> 2008-----陈瑜希<poyla计数法的应用> 在然后就是自己的学习笔记 ...
- 【转】Vuex 学习总结
对于很多新手来说,只是阅读文档是不好消化,我的建议是看看 vuex 的实例,通过研究实例来学习vuex.这样就会好理解多了.如果还是不能理解,最好办法就是先把store 的四个属性:state, ge ...
- 基于COCHONUT做和弦识别
论文为:COCHONUT: Recognizing Complex Chords From MIDI Guitar Sequences 出处:international symposium/confe ...