Repeater 控件是一个容器控件,可用于从网页的任何可用数据中创建自定义列表。Repeater 控件没有自己内置的呈现功能,这意味着用户必须通过创建模板来提供 Repeater 控件的布局。当网页运行时,Repeater 控件会循环通过数据源中的记录,并为每个记录呈现一个项。

1.向网页中添加Repeater 控件

将 Repeater 控件从“工具箱”任务窗格拖放到网页上。

2.为 Repeater 控件创建模板

  在“代码”视图中,将插入点放置在 <asp:Repeater></asp:Repeater> 标记内。

   Repeater 控件支持的 Repeater 模板:

  HeaderTemplate 和 FooterTemplate: 包含分别呈现在列表的开始和结束处的文本和控件。

  ItemTemplate: 包含要逐一呈现给数据源中的每个数据项的 HTML 元素和控件。

  AlternatingItemTemplate: 交互显示给数据源中的其他每个数据项的 HTML 元素和控件。通常,可以使用此模板来为替代项创建不同的外观,例如指定一种不同于                  ItemTemplate 中所指定颜色的背景色。

  SeparatorTemplate:一般情况下很少用到 包含呈现在每项之间的元素。典型的示例可能是一条直线(使用 HR 元素)。

3.绑定数据与简单操作

  在后台中代码绑定

Repeater1.DataSource = new userData().select();//数据源指向 Repeater1.DataBind();//数据绑定

界面中显示内容绑定显示数据用<%#Eval("字段名称") %>,一个简单人员管理系统为例,进行简单操作,界面代码:

 <asp:Repeater ID="Repeater1" runat="server">    <%--插入Repester控件--%>
<HeaderTemplate>              <%--列头显示--%>
<table id="tb">
<tr id="tr_head">
<td>用户名</td>
<td>密码</td>
<td>昵称</td>
<td>性别</td>
<td>年龄</td>
<td>生日</td>
<td>民族</td>
<td>操作</td>                 <%--插入一个操作列--%>
</tr>
</HeaderTemplate>
<ItemTemplate>                        <%--循环展示数据--%>
<tr class="tr_item" style="<%#Eval("Red") %>"> <%--扩展一个Red属性,可用于样式表中,作一个预警--%>
<td><%#Eval("Username") %></td>
<td><%#Eval("Pword") %></td>
<td><%#Eval("Nickname") %></td>
<td><%#Eval("Sexstr") %></td>
<td><%#Eval("Age") %></td>
<td><%#Eval("Birstr") %></td>
<td><%#Eval("NationName") %></td>
<td>
<a onclick="return del();" href="Delte.aspx?id=<%#Eval("Username") %>" >删除</a> &nbsp
<a href="updata.aspx?upid=<%#Eval("Username") %>" target="_blank" >修改</a> <%--删除与修改操作--%>
</td>
</tr>
</ItemTemplate>
<FooterTemplate></table></FooterTemplate>     《%-- 列尾显示--%>
</asp:Repeater>

1.通过属性拓展来做一个预警 比如年龄小于20的列显示为红色,就在实体类中拓展一个熟悉,用做样式表中:拓展属性

 public int Age  //计算年龄
{
get { return DateTime.Now.Year - _Birthday.Year; }
}
public string Red
{
get {
if (Age < )//年龄小于20
{
return "background-color: red;"; //样式表的样式
}
else //如果不是年龄小于20返回一个空的字符创
{
return "";
}
}
}

2.在js端实现一个光棒效果,代码如下  :

<script type="text/javascript">
var item = document.getElementsByClassName("tr_item");
for (var v = ; v < item.length;v++)
{
var ordcolor = "";//定义一个鼠标指向前的颜色
item[v].onmouseover = function ()//鼠标移入颜色变为黄色
{
ordcolor=this.style.backgroundColor;//记录改变之前的颜色
this.style.backgroundColor = "yellow";
};
item[v].onmouseout = function ()//鼠标移出颜色变为原来的颜色
{
this.style.backgroundColor = ordcolor;
};
}
</script>

3.简单的删除与修改操作,用QueryString - 地址栏数据拼接传主键值 格式为?key=value

删除操作:创建一个删除的页面,只需要执行后台代码

    //将要删除的主键值去出来
string uname = Request["id"];
//执行删除方法
new userData().delete(uname);
//刷新跳转页面
Response.Redirect("Default.aspx");
//为防止用户误操作 可在js端先进行判断确定删除以后在执行 js端del()方法
<script type="text/javascript">
function del() {
var ok = confirm("是否确定要删除?");
if (ok == false) {
return false;
}
}
</script>

修改操作:添加一个属性target="_blank" 在新页面打开,将主键值传到修改页面查出数据绑定到修改页面这里绑定数据要写在if (!IsPostBack)里面,在进行修改操作

 

Repeater 控件的更多相关文章

  1. ASP.Net中通过Jquery前端对Repeater控件绑定的数据进行操作

    说明:由于Repeater控件是动态绑定,通过Id获取数据只能默认获取第一行: 1.对Repeater中div设置样式 2.通过$(".css").each(function(){ ...

  2. WebForm(四)——Repeater控件(重要、好用)

    Repeater控件,可以用来一次显示一组数据项.比如,可以用它们显示一个数据表中的所有行.             Repeater控件完全由模板驱动,提供了最大的灵活性,可以任意设置它的输出格式. ...

  3. Repeater控件用法

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Repeater.aspx. ...

  4. Repeater控件使用中的一些小问题

    网页上用来展示列表的数据,发现还是Repeater比GridView,DetailView之类的要灵活些,所以近期用到了就总结下遇到的一些情况,保留下来以备之后查阅,不用现问度娘了... 自己摸索的, ...

  5. Repeater控件 ---表格展示数据

    简介: Repeater控件是Web 服务器控件中的一个容器控件,它使您可以从页的任何可用数据中创建出自定义列表. Repeater 控件不具备内置的呈现功能,这表示用户必须通过创建模板为 Repea ...

  6. Repeater控件使用(含删除,分页功能)

    Repeater控件使用(含删除,分页功能) 摘自:http://www.cnblogs.com/alanliu/archive/2008/02/25/914779.html 前臺代碼 <%@ ...

  7. asp.net学习之Repeater控件

    asp.net学习之Repeater控件 文章摘自:http://www.cnblogs.com/shipfi/archive/2009/10/19/1585703.html Repeater控件和D ...

  8. Webform(Repeater控件)

    一.Repeater控件 有五大模板 ItemTemplate :有多少条数据,执行多少遍        AlternatingItemTemplate : 对交替数据项进行格式设置       Se ...

  9. [ASP.NET]asp.net Repeater控件的使用方法

    asp.net Repeater控件的使用方法 -- : 4770人阅读 评论() 收藏 举报 asp.netserveraspdatasetdeletexhtml 今天学习了,Repeater控件 ...

随机推荐

  1. 基于腾讯手Q样式规范Frozen UI

    Frozen UI是一个开源的简单易用,轻量快捷的移动端UI框架.基于手Q样式规范,选取最常用的组件,做成公用离线包减少请求,升级方式友好,文档完善,目前全面应用在腾讯手Q增值业务中. css组件包括 ...

  2. 【腾讯Bugly干货分享】Android ImageView 正确使用姿势

    本文来自于腾讯bugly开发者社区,未经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/5832602d7196970d65901d76 导语 本文主要介绍了ImageV ...

  3. 图解集合6:LinkedHashMap

    初识LinkedHashMap 上两篇文章讲了HashMap和HashMap在多线程下引发的问题,说明了,HashMap是一种非常常见.非常有用的集合,并且在多线程情况下使用不当会有线程安全问题. 大 ...

  4. 前端er是否忽略了某些东西?——读《ppk谈JavaScript》

    关于书 “不知道ppk的网站QuirksMode,说明你可能还没有真正成为资深的JavaScript程序员.” ——Roger Johansson,瑞典资深Web专家. ppk是世界级前端技术专家,W ...

  5. MySQL 复制表结构

    200 ? "200px" : this.width)!important;} --> 介绍 有时候我们需要原封不动的复制一张表的表结构来生成一张新表,MYSQL提供了两种便 ...

  6. MySQL mysqlslap压测

    200 ? "200px" : this.width)!important;} --> 介绍 mysqlslap是mysql自带的一个性能压测工具:mysqlslap用于和其 ...

  7. HTML、CSS、JS对unicode字符的不同处理

    unicode字符的不同表示法 unicode字符在html.css和js中的表示方法均不相同,下面分别作介绍. 原文发表于这里 css表示法 首先来一段很常见的bootstrap的字体图标代码: . ...

  8. Linux学习之Exam系统发布

    配置时间:2015年11月27日 配置人:撰写人:微冷的雨   Happy 01.Linux安装图 欢迎页面 桌面 02.Linux命令之文件目录操作 给北大青鸟五道口校区创建三个机房(L4,L5,L ...

  9. junit测试,使用classpath和file 加载文件的区别

    用junit测试发现一个问题,怎么加载配置文件?一直都出现这样的错误 ERROR: org.springframework.test.context.TestContextManager - Caug ...

  10. SQL Server游标

    什么是游标 结果集,结果集就是select查询之后返回的所有行数据的集合. 游标则是处理结果集的一种机制吧,它可以定位到结果集中的某一行,多数据进行读写,也可以移动游标定位到你所需要的行中进行操作数据 ...