asp.net repeater控件操作

Repeater控件和DataList控件，可以用来一次显示一组数据项。比如，可以用它们显示一个数据表中的所有行。　　Repeater控件完全由模板驱动，提供了最大的灵活性，可以任意设置它的输出格式。　　DataList控件也由模板驱动，和Repeater不同的是，DataList默认输出是HTML表格，DataList将数据源中的记录输出为HTML表格一个个的单元格。

Repeater支持以下5种模板 ● ItemTemplate : 对每一个数据项进行格式设置 (必须的添加项) ● AlternatingItemTemplate : 对交替数据项进行格式设置 ● SeparatorTemplate : 对分隔符进行格式设置 ● HeaderTemplate : 对页眉进行格式设置 ● FooterTemplate : 对页脚进行格式设置

　Repeater控件有以下事件： ● DataBinding : Repeater控件绑定到数据源时触发 ● ItemCommand : Repeater控件中的子控件触发事件时触发 ● ItemCreated : 创建Repeater每个项目时触发 ● ItemDataBound : Repeater控件的每个项目绑定数据时触发

 //table画横线样式表table画横线样式表table画横线样式表table画横线样式表

 table.tabData{border-collapse: collapse;border: 1px solid #9CF;text-align:center;}

 table.tabData thead td,table.set_border th{font-weight:bold;background-color:White;}

 table.tabData tr:nth-child(even){background-color:#EAF2D3;}

 table.tabData td,table.border th{border:1px solid #C3C3C3;text-align:center;}

//repeater画横线样式表
 1 <asp:Repeater ID="Repeater1" runat="server">

         <HeaderTemplate>

             <table class="tabData">

                 <tr class="tr_head">

                     <th style="width: 200px; text-align: center;">

                         县

                     </th>

                     <th style="width: 200px; text-align: center;">

                         乡

                     </th>

                      <th style="width: 200px; text-align: center;">

                         村

                     </th>

                     <th style="width: 200px; text-align: center;">

                         查看/修改

                     </th>

                 </tr>

         </HeaderTemplate>

         <ItemTemplate>

             <tr style='background-color: <%#(Container.ItemIndex%2==0)?"#FFFFF;":"#fcf3f4"%>'

                 onmouseover="change_colorOver(this)" onmouseout="change_colorOut(this)">

                 <td>

                     <%#Eval("XianID")%>

                 </td>

                  <td>

                     <%#GetNameByID(Eval("XiangID"))%>

                 </td>

                 <td>

                     <%#Eval("strName")%>

                 </td>

                 <td>

                     <input type="button" value="查看/修改" onclick="ShowFrm(<%#Eval("ID") %>)" />

                 </td>

                 <%-- <td><input type="button" value="删除" onclick="FunDelete(<%#Eval("ID") %>)" /></td>--%>

             </tr>

         </ItemTemplate>

         <FooterTemplate>

             <!--底部模板-->

             </table>

             <!--表格结束部分-->

         </FooterTemplate>

     </asp:Repeater>

 repeater 绑定示例文件

同时需要在后台绑定repeater的数据源

　　Container.ItemIndex为当前行的索引，从0开始

　　style='background-color: <%#(Container.ItemIndex%2==0)?"#FFFFF;":"#fcf3f4"%>' 设置了repeater的隔行变色

　　onmouseover="change_colorOver(this)" onmouseout="change_colorOut(this)" 设置了repeater的鼠标悬浮变色

js方法如下(colorName为页面中的一个隐藏的input标签，用于保存onmouseover时的颜色值)

　　function change_colorOver(e) { 　　var oldColor = e.style.backgroundColor; 　　document.getElementById("colorName").value = oldColor; 　　e.style.backgroundColor = "#b9bace"; 　　} 　　function change_colorOut(e) { 　　 e.style.backgroundColor = document.getElementById("colorName").value; 　　}

</script>

嵌套Repeater示例

 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="Web.BasicData.Data.WebForm1" %>

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head runat="server">

     <title></title>

    <script src="../../Scripts/jquery-1.4.1.js" type="text/javascript"></script>

     <script type="text/javascript">

         //表格鼠标悬停换色

         function change_colorOver(e) {

             var oldColor = e.style.backgroundColor;

             document.getElementById("colorName").value = oldColor;

             e.style.backgroundColor = "#b9bace";

         }

         function change_colorOut(e) {

             e.style.backgroundColor = document.getElementById("colorName").value;

         }

         //显示和隐藏子菜单

         function Ctoggle(obj) {

             if (obj.alt == "open") {

                 obj.alt = "close";

                 obj.src = "../../images/minus.gif";

                 $(obj).parent().parent().next().fadeIn();

             } else {

                 obj.alt = "open";

                 obj.src = "../../images/plus.gif";

                 $(obj).parent().parent().next().fadeOut();

             }

         }

     </script>

 </head>

 <body>

     <form id="form1" runat="server">

     <div>

      <asp:Repeater ID="R1" runat="server" onitemdatabound="R1_ItemDataBound">

         <HeaderTemplate>

             <table class="tabData">

                 <tr class="tr_head">

                     <th style="width: 200px; text-align: center;">

                         县

                     </th>

                     <th style="width: 200px; text-align: center;">

                         乡

                     </th>

                     <th style="width: 200px; text-align: center;">

                         查看/修改

                     </th>

                 </tr>

         </HeaderTemplate>

         <ItemTemplate>

             <tr style='background-color: <%#(Container.ItemIndex%2==0)?"#ccc;":"#fcf3f4"%>'

                 onmouseover="change_colorOver(this)" onmouseout="change_colorOut(this)">

                 <td>

                <img alt="open" src="../../images/plus.gif" onclick="Ctoggle(this)" />    <%#Eval("XianID")%>

                 </td>

                  <td>

                     <%#Eval("strName")%>

                 </td>

                 <td>

                     <input type="button" value="查看/修改" onclick="ShowFrm(<%#Eval("ID") %>)" />

                 </td>

             </tr>

            <tr style="display:none">

                <td colspan="">

                    <asp:Repeater ID="R2" runat="server" >

                        <ItemTemplate>

                        <table class="tabData">

                            <tr style='background-color: <%#(Container.ItemIndex%2==0)?"#ccc;":"#fcf3f4"%>'

                                onmouseover="change_colorOver(this)" onmouseout="change_colorOut(this)">

                                <td style="width:100px"></td>

                                <td style="width:100px;">

                                    <%#Eval("XiangID")%>

                                </td>

                                <td style="width:200px;">

                                    <%#Eval("strName")%>

                                </td>

                                <td style="width:200px;">

                                    <input type="button" value="查看/修改" onclick="ShowFrm(<%#Eval("ID") %>)" />

                                </td>

                            </tr>

                        </ItemTemplate>

                        <FooterTemplate>

                            <!--底部模板-->

                            </table>

                            <!--表格结束部分-->

                        </FooterTemplate>

                    </asp:Repeater>

                </td>

             </tr>

         </ItemTemplate>

         <FooterTemplate>

             <!--底部模板-->

             </table>

             <!--表格结束部分-->

         </FooterTemplate>

     </asp:Repeater>

     </div>

     <div id="divhidd" style=" width:100px; height:100px; background-color:#aaa; display:none;"></div>

     </form>

     <%--定义背景色的隐藏域--%>

     <input type="hidden" id="colorName" value="" />

 </body>

 </html>

前台代码

 using System;

 using System.Collections.Generic;

 using System.Linq;

 using System.Web;

 using System.Web.UI;

 using System.Web.UI.WebControls;

 using System.Text;

 using System.Data;

 namespace Web.BasicData.Data

 {

     public partial class WebForm1 : System.Web.UI.Page

     {

         protected void Page_Load(object sender, EventArgs e)

         {

             if (!IsPostBack)

             {

                 BindData();

             }

         }

         public void BindData()

         {

             StringBuilder strSql = new StringBuilder();

             strSql.Append("  SELECT A.ID, B.strName AS XianID,A.strName FROM dbo.BD_Address_Xiang A INNER JOIN dbo.BD_Address_Xian B ON A.XianID=B.ID");

             DataTable dt = SQLHelper.ExecuteDataTable(strSql.ToString());

             if (dt != null && dt.Rows.Count != )

             {

                 this.R1.DataSource = dt.DefaultView;

                 this.R1.DataBind();

             }

         }

         protected void R1_ItemDataBound(object sender, RepeaterItemEventArgs e)

         {

             if (e.Item.ItemType == ListItemType.Item || e.Item.ItemType == ListItemType.AlternatingItem)

             {

                 Repeater rep = e.Item.FindControl("R2") as Repeater;

                 DataRowView rowv = (DataRowView)e.Item.DataItem;

                 int XiangID = Convert.ToInt32(rowv["ID"]);

                 StringBuilder strSql = new StringBuilder();

                 strSql.Append("  SELECT A.ID,B.strName AS XiangID,A.strName AS strName");

                 strSql.Append("  FROM dbo.BD_Address_Cun A INNER JOIN dbo.BD_Address_Xiang B ON A.XiangID=B.ID");

                 strSql.Append("  WHERE B.ID="+XiangID);

                 DataTable dt = SQLHelper.ExecuteDataTable(strSql.ToString());

                 if (dt != null && dt.Rows.Count != )

                 {

                     rep.DataSource = dt.DefaultView;

                     rep.DataBind();

                 }

             }

         }

     }

 }

 后台代码

后台代码

后台：启用外层Repeater的ItemDataBound事件，在ItemDataBound事件中找到内层的Repeater，并绑定内层的Repeater

前台：外层的Repeater的ItemTemplate分为两行；第一行绑定一个数据表的数据信息，和添加一个显示控制按钮

　　　第二行中嵌入内层的Repeater（样式可以独立设置）

　　然后在js文件中添加子菜单的显示和隐藏代码

asp.net repeater控件操作的更多相关文章

[ASP.NET]asp.net Repeater控件的使用方法
asp.net Repeater控件的使用方法 -- : 4770人阅读评论() 收藏举报 asp.netserveraspdatasetdeletexhtml 今天学习了,Repeater控件 ...
Asp.net Repeater控件的绑定与操作
由于repeater 控件具有的一个特性--循环 <ItemTemplate>的内容,Repeater 控件里的某个元素对象的绑定与获取,不像平常的,直接使用控件的 id 便可以给该控件进 ...
ASP.NET- 查找Repeater控件中嵌套的控件
如何在Repeater的HeaderTemplate和FooterTemplate模板中寻找控件?在Repeater的ItemTemplate模板中的控件,我们可以用Items属性来遍历行并用Find ...
Asp.net Repeater控件
Repeater控件和DataList控件,可以用来一次显示一组数据项.比如,可以用它们显示一个数据表中的所有行. Repeater控件完全由模板驱动,提供了最大的灵活性,可以任意设置它的输出 ...
ASP.NET Repeater控件实现简单分页
早上,有看MSDN,看到了 PagedDataSource 类 http://msdn.microsoft.com/zh-cn/library/system.web.ui.webcontrols.pa ...
ASP.NET Repeater 控件分页
protected void Page_Load(object sender, EventArgs e) { HttpContext context = HttpContext.Current; co ...
ASP.NET用户控件操作ASPX页面
定义一个不含数据的事件处理方法用户控件 public event EventHandler Click; protected void Button1_Click(object sender, Ev ...
ASP.NET - Repeater控件删除按钮，点击删除信息
前台代码:  <div id ="newnews" class ="Frm"> <h4>类别管理< ...
ASP.NET -- repeater控件的使用
转载自网络-原网址[http://blog.csdn.net/haitaodoit/article/details/7021214] repeater绑定数据: protected void Page ...

随机推荐

excel 下载
public string CreateExcel(string SelectedBizType, string strReportDate, DropDownList ddlYQ, DropDown ...
将 varchar 值转换为 JDBC 数据类型 DATE 时发生错误。
问题是: 我是这样解决的 : 网上的转型方法并不好使 ,我想了想可能是由于返回值是String 我就成功的解决错误了 ..下面是关于原理的讲解肯定方法不唯一至于错误,的产生,这个肯 ...
iOS的Bundle资源束制作
在静态库的制作中,很多时候我们的静态库也是带着文件,图片和多媒体资源的. 若只是直接加入到项目中也是可以,但是,考虑到方便管理(方便插件使用者的管理),我们希望把插件的资源文件打成一个包来管理. 当然 ...
redis基础操作
/** * redis的Java客户端Jedis测试验证 * * @author */ public class Test { /** * 非切片客户端链接 */ private Jedis jedi ...
windows下配置svn的https访问
svn是一个功能强大的代码版本管理系统,可以将服务端安装在linux.unix以及windows下.svn通常采用http方式进行代码提交与下载.由于密码采用明文传输,因此存在泄密的风险.若采用htt ...
MFC 多线程
MFC对多线程编程的支持 MFC中有两类线程,分别称之为工作者线程和用户界面线程.二者的主要区别在于工作者线程没有消息循环,而用户界面线程有自己的消息队列和消息循环. 工作者线程没有消息机制,通 ...
五种实用DOM方法总结
DOM:Document Object Model 文档对象模型对象的三种类型:用户定义类型.内建对象.宿主对象节点类型:元素节点.文本节点.属性节点 getElementById()方法: 将返 ...
JSONP有什么作用
1.解决跨域访问数据由于同源策略的限制,XmlHttpRequest只允许请求当前源(域名.协议.端口)的资源,为了实现跨域请求,可以通过script标签实现跨域请求 ...
cocos2d-js 入门一（[isNaN()和isFinite()，字符和Number之间的转化）
isNaN() : 用于检查其参数是否是非数字值.// 提示:是非数字哦.(not a number)document.write(isNaN(0) ) //返回falsedocument.writ ...
Truck History--poj1789
Truck History Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 21534 Accepted: 8379 De ...

asp.net repeater控件操作

asp.net repeater控件操作的更多相关文章

随机推荐

热门专题