<HeaderTemplate></HeaderTemplate>  头模板——在加载开始执行一遍

<FooterTemplate></FooterTemplate>  脚模板——有多少条数据,执行多少遍

<ItemTemplate></ItemTemplate>  项模板——在加载最后执行一遍

<AlternatingItemTemplate></AlternatingItemTemplate>  交替展示模板

  1. 纯HTML+css+js制作
  2. 添加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 的使用的更多相关文章

  1. C# 在Repeater 的ItemDataBound 如何转换e.Item.DataItem 的类型

    1.使用DataSet和DataTable绑定数据源时,用 DataRowView view = (DataRowView)e.Item.DataItem; 2.DataReader绑定数据源时,用 ...

  2. Webform(七)——内置对象(Session、Application)和Repeater的Command操作

    内置对象:用于页面之间的数据交互 为什么要使用这么内置对象?因为HTTP的无状态性. 一.内置对象 (一)Session 跟Cookies一样用来存储用户数据 1.Session.Cookies对比 ...

  3. Webform(五)——内置对象(Response、Request)和Repeater中的数据增删改

    一.内置对象 (一)Response对象 1.简介:response 对象在ASP中负责将信息传递给用户.Response对象用于动态响应客户端请求,并将动态生成的响应结果返回到客户端浏览器中,使用R ...

  4. webform Repeater重复器、地址栏传值、Response

    Repeater: 重复器 <HeaderTemplate></HeaderTemplate> - 头模板:在循环开始时,其内容只会打印一遍 <ItemTemplate& ...

  5. Repeater、地址栏传值、Response--2016年12月30日

    Repeater  Repeater支持以下5种模板       ● ItemTemplate : 对每一个数据项进行格式设置 [Formats each item from the data sou ...

  6. C#中用radio单选Repeater循环数据,js实现

    <asp:Repeater ID="rpt" runat="server"> <ItemTemplate> <tr data-id ...

  7. asp:Repeater实例备忘

    1.前置部分 <asp:Repeater ID="rptPlanNo" runat="server" OnItemDataBound="rptP ...

  8. webform Repeater、地址栏传值、Response

    Repeater: 重复器 Repeater中有五个模板,这里需要注意的是4个 <HeaderTemplate> - 开头,只执行一次的内容 <ItemTemplate> - ...

  9. ASP.NET中获取Repeater模板列中LinkButton按钮事件中获取ID等

    前台页面中: <asp:Repeater ID="repComment" runat="server">            <ItemTe ...

  10. Repeater的分页

      Repeater控件是个好东西.轻量级.又好用.完全的自定义.但是,正是因为这些优点它没有自动分页的功能.这个需要研究一下.我看了一下起点等小说网站,那些什么推荐排名榜用Repeater控件那是很 ...

随机推荐

  1. Microduino-W5500

    2014-06-13, Microduino 公布了全新的以太网模块Microduino-W5500 ,模块基于WIZnet以太网芯片,拥有独特的全硬件TCP/IP协议栈. attachment_id ...

  2. 【Mongodb教程 第三课 】MongoDB 删除数据库

    dropDatabase() 方法 MongoDB db.dropDatabase() 命令是用来删除一个现有的数据库. 语法: dropDatabase() 命令的基本语法如下: db.dropDa ...

  3. IIS 配置 FTP 网站 H5 音频标签自定义样式修改以及添加播放控制事件

    IIS 配置 FTP 网站   在 服务器管理器 的 Web服务器IIS 上安装 FTP 服务 在 IIS管理器 添加FTP网站 配置防火墙规则 说明:服务器环境是Windows Server 200 ...

  4. NS3网络仿真(12): ICMPv4协议

    快乐虾 http://blog.csdn.net/lights_joy/ 欢迎转载,但请保留作者信息 ICMP的全称是 Internet ControlMessage Protocol . 其目的就是 ...

  5. Django模板语言(一)

    1,Django模板语言 1.1>基础语法:1.1.1,变量相关:{{ 变量名 }},1.1.2,逻辑相关{% ... %} 在Django模板语言中按此语法使用:{{ 变量名 }},当模板引擎 ...

  6. Struts2自定义过滤器的小例子-入门篇

    创建web项目    实现的效果! 用户点击页面不同的链接,后台调用不同的代码! 创建两个类实现共同的接口! public interface Action { String execute(); } ...

  7. sql server 支持中文繁体和简体

    SET ANSI_PADDING ON  INSERT INTO 表 VALUES (N'中文')

  8. mac下安装eclipse+CDT

    测试文件test.cpp #include <iostream>using namespace std; int main() {    cout << "!!!He ...

  9. ML.NET

    ML.NET http://www.cnblogs.com/BeanHsiang/category/1218714.html 随笔分类 - 使用ML.NET实现NBA得分预测 摘要: 本文将介绍一种特 ...

  10. OSI模型与TCP/IP模型基础

    一.OSI七层模型 OSI(Open System Interconnection),OSI是一个开放性的通行系统互连参考模型,是一个协议规范.OSI七层模型是一种框架性的设计方法 ,建立七层模型的主 ...