当前位置：Gxlcms > asp.net > 详解ASP.NET数据绑定操作中Repeater控件的用法

详解ASP.NET数据绑定操作中Repeater控件的用法

时间：2021-07-01 10:21:17 帮助过：10人阅读

2016617184159990.png (461×410)

一、绑定控件之Repeater
.NET封装了多种数据绑定控件，诸如GridView、DataList等但该篇文章将会从Repeater入手，因为Repeater只提供了基本的数据绑定模板，没有内置其它分页等功能，所以它是最原始的数据绑定控件，只要能够熟练运用Repeater控件其它的绑定控件也就很简单了。
1、Repeater简介
Repeater 控件是基本模板化数据列表。 它不像GridView控件一样能够可视化的设计格式或样式，因此开发时在控件模板中必须显式声明所有格式、格式和样式标记。另外Repeater控件没有内置选择、排序、编辑、分页等功能，它只提供了基本的数据绑定，但是它为开发人员提供了ItemCommand 事件，该事件支持在控件中收发命令。
想要绑定数据，模板是必不可少的，Repeater控件同样支持数据模板，而且还可以在模板中添加想要的标签，它主要用法如下图：

2016617184226837.png (554×365)

Note：每个 Repeater 控件必须定义 ItemTemplate。

2016617184244624.png (870×204)

二、控件使用技巧
上文讲解了Repeater基本的使用方法及它的一些基本特性，接下来做几个经典的示例来运用Repeater控件。
1、数据绑定之删除、编辑
该示例将会使用Asp.net的前台和后台结合来实现显示数据，并能够编辑和删除数据。
删除页面：

2016617184314017.png (1006×152)

编辑页面：

2016617184335193.png (1007×163)

前台代码：在单击编辑按钮后将会进入编辑页面，页面是由两个Panel控件来控制，通过传递ID号的方式判断显示的是编辑页面还是删除页面，另外前台代码通过设置控件的CommandArgument属性来传递后台所需要判断的id号。

  1. <body> 
  2.   <form id="form1" runat="server"> 
  3.   <div> 
  4.     <asp:Repeater ID="userRepeat" runat="server" OnItemCommand="userRepeat_ItemCommand" OnItemDataBound="userRepeat_ItemDataBound"> 
  5.       <HeaderTemplate> 
  6.         <table border="1" style="width:1000px;text-align:center;border-collapse:collapse;"> 
  7.           <thead style="background-color:red;"> 
  8.             <tr> 
  9.               <th>ID</th> 
  10.               <th>内容</th> 
  11.               <th>操作</th> 
  12.             </tr> 
  13.           </thead> 
  14.       </HeaderTemplate> 
  15.       <ItemTemplate> 
  16.         <asp:Panel ID="plItem" runat="server"> 
  17.           <tr> 
  18.             <td><asp:Label runat="server" ID="lblID" Text='<%#Eval("id") %>'></asp:Label></td> 
  19.             <td><%#Eval("name") %></td> 
  20.             <td> 
  21.               <asp:LinkButton ID="lbtEdit" CommandName="Edit" CommandArgument='<%#Eval("id") %>' runat="server">编辑</asp:LinkButton> 
  22.               <asp:LinkButton ID="lbtDelete" CommandName="Delete" CommandArgument='<%#Eval("id") %>' runat="server">删除</asp:LinkButton> 
  23.             </td> 
  24.           </tr> 
  25.         </asp:Panel> 
  26.         <asp:Panel ID="plEdit" runat="server"> 
  27.           <tr> 
  28.             <td><asp:Label runat="server" ID="Label1" Text='<%#Eval("id") %>'></asp:Label></td> 
  29.             <td><asp:TextBox ID="txtName" runat="server" Text='<%#Eval("name") %>'></asp:TextBox></td> 
  30.             <td> 
  31.               <asp:LinkButton ID="lbtCancel" CommandName="Cancel" CommandArgument='<%#Eval("id") %>' runat="server">取消</asp:LinkButton> 
  32.               <asp:LinkButton ID="lbtUpdate" CommandName="Update" CommandArgument='<%#Eval("id") %>' runat="server">更新</asp:LinkButton> 
  33.             </td> 
  34.           </tr> 
  35.         </asp:Panel> 
  36.       </ItemTemplate> 
  37.       <FooterTemplate> 
  38.         </table> 
  39.       </FooterTemplate> 
  40.     </asp:Repeater> 
  41.   </div> 
  42.   </form> 
  43. </body>

后台代码：在后台代码中很重要的两个事件是ItemCommand和ItemDataBound，其中ItemCommand负责接收前台传进来的按钮命令，根据命令的参数来设置后台传递的id，并在ItemDataBound中来验证id判断切换显示Panel。

  1. using System; 
  2. using System.Collections.Generic; 
  3. using System.Data; 
  4. using System.Data.SqlClient; 
  5. using System.Web; 
  6. using System.Web.UI; 
  7. using System.Web.UI.WebControls; 
  8.  
  9. namespace WebApplication4 
  10. { 
  11.   public partial class EditPage : System.Web.UI.Page 
  12.   { 
  13.     private int id = 0; //保存指定行操作所在的ID号 
  14.     /// <summary> 
  15.     /// 窗体加载时绑定数据 
  16.     /// </summary> 
  17.     /// <param name="sender"></param> 
  18.     /// <param name="e"></param> 
  19.     protected void Page_Load(object sender, EventArgs e) 
  20.     { 
  21.       if (!Page.IsPostBack) 
  22.       { 
  23.         this.DataBindToRepeater();//将数据绑定到Repeater控件上 
  24.       } 
  25.     } 
  26.  
  27.     /// <summary> 
  28.     /// 将数据源绑定Repeater控件上 
  29.     /// </summary> 
  30.     private void DataBindToRepeater() { 
  31.       //使用using语句进行数据库连接 
  32.       using (SqlConnection sqlCon=new SqlConnection("server=.;database=MyBlog;uid=sa;pwd=1")) 
  33.       { 
  34.         sqlCon.Open(); //打开数据库连接 
  35.  
  36.         SqlCommand sqlcom = new SqlCommand();  //创建数据库命令对象 
  37.         sqlcom.CommandText = "select * from match"; //为命令对象指定执行语句 
  38.         sqlcom.Connection = sqlCon; //为命令对象指定连接对象 
  39.  
  40.         this.userRepeat.DataSource = sqlcom.ExecuteReader();  //为Repeater对象指定数据源 
  41.         this.userRepeat.DataBind(); //绑定数据源 
  42.       } 
  43.     } 
  44.  
  45.     /// <summary> 
  46.     /// Repeater控件命令事件 
  47.     /// </summary> 
  48.     /// <param name="source"></param> 
  49.     /// <param name="e"></param> 
  50.     protected void userRepeat_ItemCommand(object source, RepeaterCommandEventArgs e) 
  51.     { 
  52.       //获取命令文本，判断发出的命令为何种类型，根据命令类型调用事件 
  53.       if (e.CommandName=="Edit") //编辑命令 
  54.       { 
  55.         id = int.Parse(e.CommandArgument.ToString());  //获取命令ID号 
  56.       } 
  57.       else if (e.CommandName=="Cancel")  //取消更新命令 
  58.       { 
  59.         id = -1; 
  60.       } 
  61.       else if(e.CommandName=="Delete")  //删除行内容命令 
  62.       { 
  63.         id = int.Parse(e.CommandArgument.ToString());  //获取删除行的ID号 
  64.         //删除选定的行，并重新指定绑定操作 
  65.         this.DeleteRepeater(id); 
  66.       } 
  67.       else if (e.CommandName == "Update") //更新行内容命令 
  68.       { 
  69.         //获取更新行的内容和ID号 
  70.         string strText = ((TextBox)e.Item.FindControl("txtName")).Text.Trim(); 
  71.         int intId=int.Parse(((Label)e.Item.FindControl("lblID")).Text); 
  72.         //更新Repeater控件的内容 
  73.         this.UpdateRepeater(strText,intId); 
  74.       } 
  75.  
  76.       //重新绑定控件上的内容 
  77.       this.DataBindToRepeater(); 
  78.     } 
  79.  
  80.     /// <summary> 
  81.     /// 删除行内容 
  82.     /// </summary> 
  83.     /// <param name="intId">删除行所在内容的ID</param> 
  84.     private void DeleteRepeater(int intId) { 
  85.       using (SqlConnection sqlCon = new SqlConnection("server=.;database=MyBlog;uid=sa;pwd=1")) 
  86.       { 
  87.         sqlCon.Open(); //打开数据库连接 
  88.  
  89.         SqlCommand sqlcom = new SqlCommand();  //创建数据库命令对象 
  90.         sqlcom.CommandText = "delete from match where id=@id"; //为命令对象指定执行语句 
  91.         sqlcom.Connection = sqlCon; //为命令对象指定连接对象 
  92.  
  93.         //创建参数集合,并向sqlcom中添加参数集合 
  94.         SqlParameter sqlParam = new SqlParameter("@id", intId); 
  95.         sqlcom.Parameters.Add(sqlParam); 
  96.  
  97.         sqlcom.ExecuteNonQuery();  //指定更新语句 
  98.  
  99.       } 
  100.     } 
  101.  
  102.     /// <summary> 
  103.     /// 更新Repeater控件中的内容 
  104.     /// </summary> 
  105.     /// <param name="strText">修改后的内容</param> 
  106.     /// <param name="intId">内容所在行的ID号</param> 
  107.     private void UpdateRepeater(string strText,int intId) { 
  108.       using (SqlConnection sqlCon = new SqlConnection("server=.;database=MyBlog;uid=sa;pwd=1")) 
  109.       { 
  110.         sqlCon.Open(); //打开数据库连接 
  111.  
  112.         SqlCommand sqlcom = new SqlCommand();  //创建数据库命令对象 
  113.         sqlcom.CommandText = "update match set name=@str where id=@id"; //为命令对象指定执行语句 
  114.         sqlcom.Connection = sqlCon; //为命令对象指定连接对象 
  115.  
  116.         //创建参数集合,并向sqlcom中添加参数集合 
  117.         SqlParameter[] sqlParam = { new SqlParameter("@str", strText), new SqlParameter("@id", intId) }; 
  118.         sqlcom.Parameters.AddRange(sqlParam); 
  119.  
  120.         sqlcom.ExecuteNonQuery();  //指定更新语句 
  121.          
  122.       } 
  123.     } 
  124.  
  125.     /// <summary> 
  126.     /// Repeater控件数据绑定时发生的事件 
  127.     /// </summary> 
  128.     /// <param name="sender"></param> 
  129.     /// <param name="e"></param> 
  130.     protected void userRepeat_ItemDataBound(object sender, RepeaterItemEventArgs e) 
  131.     { 
  132.       //判断Repeater控件中的数据是否是绑定的数据源，如果是的话将会验证是否进行了编辑操作 
  133.       //ListItemType 枚举表示在一个列表控件可以包括，例如 DataGrid、 DataList和 Repeater 控件的不同项目。  
  134.       if (e.Item.ItemType==ListItemType.Item || e.Item.ItemType==ListItemType.AlternatingItem) 
  135.       { 
  136.         //获取绑定的数据源，这里要注意上面使用sqlReader的方法来绑定数据源，所以下面使用的DbDataRecord方法获取的 
  137.         //如果绑定数据源是DataTable类型的使用下面的语句就会报错. 
  138.         System.Data.Common.DbDataRecord record = (System.Data.Common.DbDataRecord)e.Item.DataItem; 
  139.         //DataTable类型的数据源验证方式 
  140.         //System.Data.DataRowView record = (DataRowView)e.Item.DataItem; 
  141.  
  142.         //判断数据源的id是否等于现在的id，如果相等的话证明现点击了编辑触发了userRepeat_ItemCommand事件 
  143.         if (id == int.Parse(record["id"].ToString())) 
  144.         { 
  145.           ((Panel)e.Item.FindControl("plItem")).Visible = false; 
  146.           ((Panel)e.Item.FindControl("plEdit")).Visible = true; 
  147.         } 
  148.         else 
  149.         { 
  150.           ((Panel)e.Item.FindControl("plItem")).Visible = true; 
  151.           ((Panel)e.Item.FindControl("plEdit")).Visible = false; 
  152.         } 
  153.       } 
  154.     } 
  155.   } 
  156. }

2、分页--PageDataSource
前台代码：使用原始的html文本，并添加了一个Literal标签，用来动态添加并指定html标签。
页面截图：

2016617184644312.png (1016×99)

  1. <html xmlns="http://www.w3.org/1999/xhtml"> 
  2. <head runat="server"> 
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
  4.   <title></title> 
  5.   <style type="text/css"> 
  6.  
  7.     .pageBar 
  8.     { 
  9.       margin-top: 10px; 
  10.     } 
  11.     .pageBar a 
  12.     { 
  13.       color: #333; 
  14.       font-size: 12px; 
  15.       margin-right: 10px; 
  16.       padding: 4px; 
  17.       border: 1px solid #ccc; 
  18.       text-decoration: none; 
  19.     } 
  20.   </style> 
  21. </head> 
  22. <body> 
  23.   <form id="form1" runat="server"> 
  24.   <div> 
  25.      
  26.     <asp:Repeater ID="Repeater1" runat="server" > 
  27.       <HeaderTemplate> 
  28.         <table border="1" cellpadding="0" cellspacing="0" style="width:1006px;border-collapse:collapse; text-align:center;"> 
  29.           <tr> 
  30.             <th style="background-color:red">ID</th> 
  31.             <th style="background-color:red">内容</th> 
  32.           </tr> 
  33.       </HeaderTemplate> 
  34.       <ItemTemplate> 
  35.         <tr> 
  36.           <td><asp:Label ID="lblId" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"id") %>' ></asp:Label></td> 
  37.           <td><%# DataBinder.Eval(Container.DataItem,"name") %></td> 
  38.         </tr> 
  39.       </ItemTemplate> 
  40.       <FooterTemplate> 
  41.         </table> 
  42.       </FooterTemplate> 
  43.     </asp:Repeater> 
  44.      
  45.   </div> 
  46.   <div class="pageBar"> 
  47.     <asp:Literal ID="ltlPageBar" runat="server"></asp:Literal> 
  48.   </div> 
  49.   </form> 
  50. </body> 
  51. </html>

后台代码：Repeater控件的数据源是PagedDataSource对象，在页面加载时为该对象动态指定了分页的属性，并使用Literal标签来动态指定每个标签跳转页的链接。

  1. using System; 
  2. using System.Collections.Generic; 
  3. using System.Data; 
  4. using System.Data.SqlClient; 
  5. using System.Text; 
  6. using System.Web; 
  7. using System.Web.UI; 
  8. using System.Web.UI.WebControls; 
  9.  
  10. namespace WebApplication4 
  11. { 
  12.   public partial class PageDemo : System.Web.UI.Page 
  13.   { 
  14.     private string id = ""; 
  15.     protected void Page_Load(object sender, EventArgs e) 
  16.     { 
  17.       if (!Page.IsPostBack) 
  18.       { 
  19.         //设置当前页的索引 
  20.         int pageIndex = 1; 
  21.         try 
  22.         { 
  23.           //获取当前索要跳转页的索引号 
  24.           pageIndex = Convert.ToInt32(Request.QueryString["Page"]); 
  25.           //如果是第0页将会跳转入第1页 
  26.           if (pageIndex <= 0) 
  27.           { 
  28.             pageIndex = 1; 
  29.           } 
  30.         } 
  31.         catch 
  32.         { 
  33.           pageIndex = 1; 
  34.         } 
  35.  
  36.         DataTable dt = this.GetDataTable(); //获取绑定的数据表 
  37.  
  38.         PagedDataSource pds = new PagedDataSource();  //创建分页数据源对象         
  39.         pds.DataSource = dt.DefaultView;  //为数据源对象设置数据源 
  40.         pds.AllowPaging = true; //对象允许分页 
  41.         pds.PageSize = 2;  //设置对象每页显示的大小 
  42.         pds.CurrentPageIndex = pageIndex - 1; //设置数据源的当前页 
  43.  
  44.         //向Repeater控件上绑定分页数据源控件 
  45.         this.Repeater1.DataSource = pds; 
  46.         this.Repeater1.DataBind(); 
  47.  
  48.         //使用Literal标签来动态指定每个标签跳转页的链接 
  49.         ltlPageBar.Text = this.GetPageBar(pds); 
  50.       } 
  51.     } 
  52.  
  53.     /// <summary> 
  54.     /// 获取每个标签上的跳转页的链接地址 
  55.     /// </summary> 
  56.     /// <param name="pds">分页数据源对象</param> 
  57.     /// <returns>分页操作按钮的html文本</returns> 
  58.     private string GetPageBar(PagedDataSource pds) 
  59.     { 
  60.       string pageBar = string.Empty; //声明页面标签文本 
  61.       int currentPageIndex = pds.CurrentPageIndex + 1;  //获取当前页索引 
  62.  
  63.       //判断首页的链接页面 
  64.       if (currentPageIndex == 1) //如果该页为第一页，则证明它为首页 
  65.       { 
  66.         pageBar += "<a href=\"javascript:void(0)\">首页</a>"; 
  67.       } 
  68.       else  
  69.       { 
  70.         //如果不是首页，首页链接的地址将会为1 
  71.         pageBar += "<a href=\"" + Request.CurrentExecutionFilePath + "?Page=1\">首页</a>"; 
  72.       } 
  73.  
  74.       //判断上一页链接的地址 
  75.       if ((currentPageIndex - 1) < 1) //如果上一页小于1则链接到第一页 
  76.       { 
  77.         pageBar += "<a href=\"javascript:void(0)\">上一页</a>"; 
  78.       } 
  79.       else 
  80.       { 
  81.         //如果上一页地址不是1将会链接到上一页 
  82.         pageBar += "<a href=\"" + Request.CurrentExecutionFilePath + "?Page=" + (currentPageIndex - 1) + "\">上一页</a>"; 
  83.       } 
  84.  
  85.       //指定下一页的链接地址 
  86.       if ((currentPageIndex + 1) > pds.PageCount) 
  87.       { 
  88.         //如果下一页的地址大于总页数，将会连接到首页 
  89.         pageBar += "<a href=\"javascript:void(0)\">下一页</a>"; 
  90.       } 
  91.       else 
  92.       { 
  93.         //否则的话链接到下一页 
  94.         pageBar += "<a href=\"" + Request.CurrentExecutionFilePath + "?Page=" + (currentPageIndex + 1) + "\">下一页</a>"; 
  95.       } 
  96.  
  97.       //指定末页的链接地址 
  98.       if (currentPageIndex == pds.PageCount) 
  99.       { 
  100.         pageBar += "<a href=\"javascript:void(0)\">末页</a>"; 
  101.       } 
  102.       else 
  103.       { 
  104.         pageBar += "<a href=\"" + Request.CurrentExecutionFilePath + "?Page=" + pds.PageCount + "\">末页</a>"; 
  105.       } 
  106.  
  107.       return pageBar; //返回html文本 
  108.     } 
  109.  
  110.     /// <summary> 
  111.     /// 获取数据源，重新链接数据 
  112.     /// </summary> 
  113.     /// <returns>DataTable，数据源</returns> 
  114.     private DataTable GetDataTable() 
  115.     { 
  116.       DataTable dt = new DataTable(); //创建数据库表 
  117.       using (SqlConnection con = new SqlConnection("server=.;DataBase=MyBlog;uid=sa;pwd=1;")) 
  118.       { 
  119.  
  120.         con.Open(); //打开数据库链接 
  121.  
  122.         SqlCommand sqlCom = new SqlCommand();  //声明并创建数据库命令集 
  123.         StringBuilder sqlStr = new StringBuilder(); //声明sql语句 
  124.         sqlStr.Append("select * from match");  //获取sql语句 
  125.  
  126.         sqlCom.CommandText = sqlStr.ToString(); //为sqlcommand对象指定sql语句 
  127.  
  128.         sqlCom.Connection = con;  //为sqlcommand对象指定链接对象 
  129.         SqlDataAdapter sqlDa = new SqlDataAdapter(sqlCom); //声明数据库适配器 
  130.         SqlCommandBuilder sqlBuilder = new SqlCommandBuilder(sqlDa); 
  131.         sqlDa.Fill(dt); //填充表 
  132.       } 
  133.  
  134.       return dt; 
  135.     } 
  136.  
  137.   } 
  138. }

结语
文章主要介绍了Repeater控件的基本使用方法，并通过两个示例来更深一步的学习了Repeater控件的使用。虽然Repeater控件封装的操作较少，但它是最基础的数据绑定控件，另外可以通过使用其它控件来弥补Repeater控件的不足，如可以通过使用PagedataSource类来实现数据的分页。文章写到这里并没有结束，下篇文章将会着重讨论ListView。

人气教程排行

本站所有资源全部来源于网络，若本站发布的内容侵害到您的隐私或者利益，请联系我们删除！