Repeater 使用方法
ItemTemplate: 包含要逐一呈现给数据源中的每个数据项的 HTML 元素和控件
AlternatingItemTemplate: 包含要逐一呈现给数据源中的其他每个数据项的 HTML 元素和控件。通常,可以使用此模板来为替代项创建不同的外观,例如指定一种不同于 ItemTemplate 中所指定颜色的背景色
HeaderTemplate 呈现在列表开始处的文本和空间
FooterTemplate: 呈现在列表结束处的文本和控件
SeparatorTemplate: 包含呈现在每项之间的元素。典型的示例可能是一条直线(使用 HR 元素)
添加Repeater控件,将数据绑定展示
以chinastates表为例:
<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>区域编号</td>
<td>区域名称</td>
<td>区域父级编号</td>
</tr>
</HeaderTemplate>
<ItemTemplate> <%--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>
</html>
后台代码
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
Repeater1.DataSource = new ChinaStatesData().Select("");//读出数据库数据的数据进行数据指向
Repeater1.DataBind();//绑定数据 }
}

------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
库存预警效果:
以users表为例
</body><body>
<form id="form1" runat="server">
<asp:Repeater ID="Repeater1" runat="server">
<HeaderTemplate>
<table>
<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> <tr>
<td>用户名</td>
<td>密码</td>
<td>昵称</td>
<td>性别</td>
<td>生日</td>
实体类:
public class Users
{
public Users()
{
} private string _UserName; /// <summary>
/// 用户名
/// </summary>
public string UserName
{
get { return _UserName; }
set { _UserName = value; }
} private string _PassWord; /// <summary>
/// 密码
/// </summary>
public string PassWord
{
get { return _PassWord; }
set { _PassWord = value; }
}
private string _NickName; /// <summary>
/// 昵称
/// </summary>
public string NickName
{
get { return _NickName; }
set { _NickName = value; }
}
private bool _Sex; /// <summary>
/// 性别
/// </summary>
public bool Sex
{
get { return _Sex; }
set { _Sex = value; }
} public string SexStr //扩展属性 bool类型变为 男或女
{
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 //扩展属性 加判断条件 如果大于16岁 该条属数据背景色变为红色 返回的是CSS样式 代码
{
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 使用方法的更多相关文章
- asp.net中Repeater控件用法笔记
大家可能都对datagrid比较熟悉,但是如果在数据量大的时候,我们就得考虑使用 repeater作为我们的数据绑定控件了.Repeater控件与DataGrid (以及DataList)控件的主要区 ...
- [知识库分享系列] 二、.NET(ASP.NET)
最近时间又有了新的想法,当我用新的眼光在整理一些很老的知识库时,发现很多东西都已经过时,或者是很基础很零碎的知识点.如果分享出去大家不看倒好,更担心的是会误人子弟,但为了保证此系列的完整,还是选择分享 ...
- Asp.Net初学小结
第一章 1.搭建Asp.net开发环境 1).net FrameWork(VS) 2)IIS(xp:5.1,2003:6.0,vista:70,win7:7.5) C:\Windows\Mic ...
- Asp.Net初学小结 判断数组中是否有重复的数据
Asp.Net初学小结 第一章 1.搭建Asp.net开发环境 1).net FrameWork(VS) 2)IIS(xp:5.1,2003:6.0,vista:70,win7:7.5) ...
- javaSE27天复习总结
JAVA学习总结 2 第一天 2 1:计算机概述(了解) 2 (1)计算机 2 (2)计算机硬件 2 (3)计算机软件 2 (4)软件开发(理解) 2 (5) ...
- [ASP.NET]asp.net Repeater控件的使用方法
asp.net Repeater控件的使用方法 -- : 4770人阅读 评论() 收藏 举报 asp.netserveraspdatasetdeletexhtml 今天学习了,Repeater控件 ...
- Repeater为空时显示“暂无数据”,很方便实用方法
Repeater为空时显示“暂无数据”,很方便实用方法 <FooterTemplate> <asp:Label ID="lblEmptyZP" Text=&q ...
- ASP.NET repeater添加序号列的方法
ASP.NET repeater添加序号列的方法 1.<itemtemplate> <tr><td> <%# Container.ItemIndex + 1% ...
- 在Repeater中使用DropDownList的方法
在Repeater中使用DropDownList的方法 以下代码并不完整,只记录了关键的方法 aspx代码中 假设这是一个用户管理的系统的模型,有一个下拉菜单来操作用户状态 <asp:Repea ...
随机推荐
- Python中利用LSTM模型进行时间序列预测分析
时间序列模型 时间序列预测分析就是利用过去一段时间内某事件时间的特征来预测未来一段时间内该事件的特征.这是一类相对比较复杂的预测建模问题,和回归分析模型的预测不同,时间序列模型是依赖于事件发生的先后顺 ...
- eclipse报错 :java was started but returned exit code=13
一个礼拜没打开自己电脑上的eclipse,一打开居然报错,错误提示如下: cdm运行一下Java -version和javac 运行javac时报错,错误提示如下: 然后发现jdk的bin下没有dt. ...
- NHibernate系列文章十六:使用程序集管理NHibernate项目(附程序下载)
摘要 在实际的项目中,经常是将NHibernate的实体关系映射类做成独立的工程(assembly dll),只对外提供Session调用的接口.这个程序集作为数据访问层,可以被上面的多个工程(ASP ...
- 项目名 的在JSP或JAVA中的另类写法
在JSP页面中${pageContext.request.contextPath } 表示项目名<form action="${pageContext.request.contextP ...
- 深入理解JS异步编程三(promise)
jQuery 原本写一个小动画我们可能是这样的 $('.animateEle').animate({ opacity:'.5' }, 4000,function(){ $('.animateEle2' ...
- 聊聊javascript中的面向对象
面向对象这个东西一直晕晕乎乎的,正好这段时间没有活,可以好好整理整理了! 1.什么是对象? 其实这个说起来一切东西都是对象 2.目前我们使用对象的时候,使用的是两种设计模式杂糅起来的 分别是原型模式和 ...
- maven自动部署到远程tomcat教程
使用maven的自动部署功能可以很方便的将maven工程自动部署到远程tomcat服务器,节省了大量时间. 本文章适用于tomcat的7.x ,8.x, 9.x版本. 下面是自动部的步骤 1,首先,配 ...
- ios category,protocol理解
category: 向现有的类中增加方法,同时提供方法的实现,现有类不需要做任何改动. protocol:(相当于Java或C#中的接口interface,当很多类都要需要类似的方法,但是方法具体实现 ...
- android前端开发 布局学习
元素背景设置 -------------------------------- Android中shape中的属性大全 http://www.oschina.net/question/166763_3 ...
- dubbo 使用总结
第一步: 安装注册中心Register,这里选择 zookeeper 1.zookeeper下载url:http://zookeeper.apache.org; 2.下载解压完后如下: 3.将zoo_ ...