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控件那是很 ...
随机推荐
- web 界面设计---大道至简
http://www.cnblogs.com/coder2012/p/4023442.html 一个非常精简的webpy页面博客 qing.weibo.com 新浪的轻微博也不错精简
- 使用 C＃ 开发智能手机软件：推箱子(三)
这是"使用 C# 开发智能手机软件:推箱子"系列文章的第三篇.在这篇文章中,介绍 Common/Block.cs 源程序文件. 1 namespace Skyiv.Ben.Pu ...
- <s:property>的用法(jsp获取action中的值或者方法)
1,访问Action值栈中的普通属性: <s:property value="attrName"/> 2,访问Action值栈中的对象属性(要有get set方法) ...
- jackson实体为NULL或者为空不显示
1.实体上 @JsonInclude(JsonInclude.Include.NON_NULL) 将该注解放在属性上,如果该属性为null则不参与序列化: 如果放在类上边,那对这个类的全部属性起作用 ...
- spark安装和登陆配置
1.下载安装包: http://www.igniterealtime.org/downloads/index.jsp 2.点击安装后打开登陆界面: 2.点击“高级”,设置相关配置: 3.点击“登陆”后 ...
- I.MX6 RGB clock 和 data 重合
/*********************************************************************** * I.MX6 RGB clock 和 data 重合 ...
- 《StackGAN: Text to Photo-realistic Image Synthesis with Stacked GAN》论文笔记
出处:arxiv 2016 尚未出版 Motivation 根据文字描述来合成相片级真实感的图片是一项极具挑战性的任务.现有的生成手段,往往只能合成大体的目标,而丢失了生动的细节信息.StackGAN ...
- Linux使用笔记: 使用Samba访问windows的共享目录(转载)
转自:http://easwy.com/blog/archives/mount-a-windows-shared-folder-on-linux-with-samba/ 通常我们使用Samba都是在W ...
- 【WIP】Ruby JSON
创建: 2018/03/22 以后有空补上 注: JSON.generate 参数只能是Obejct或者Array, 不可以是Hash https://docs.ruby-lang.org/ja/la ...
- UVA - 10859 Placing Lampposts 放置街灯
Placing Lampposts 传送门:https://vjudge.net/problem/UVA-10859 题目大意:给你一片森林,要求你在一些节点上放上灯,一个点放灯能照亮与之相连的所有的 ...