如何在ASP.NET中使用Repeater控件-創(chuàng)新互聯(lián)

如何在ASP.NET中使用Repeater控件?相信很多沒有經(jīng)驗(yàn)的人對(duì)此束手無(wú)策,為此本文總結(jié)了問題出現(xiàn)的原因和解決方法,通過這篇文章希望你能解決這個(gè)問題。

成都創(chuàng)新互聯(lián)-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設(shè)、高性價(jià)比鄧州網(wǎng)站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫(kù),直接使用。一站式鄧州網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設(shè)找我們,業(yè)務(wù)覆蓋鄧州地區(qū)。費(fèi)用合理售后完善,十余年實(shí)體公司更值得信賴。

如何在ASP.NET中使用Repeater控件

一、綁定控件之Repeater
.NET封裝了多種數(shù)據(jù)綁定控件,諸如GridView、DataList等但該篇文章將會(huì)從Repeater入手,因?yàn)镽epeater只提供了基本的數(shù)據(jù)綁定模板,沒有內(nèi)置其它分頁(yè)等功能,所以它是最原始的數(shù)據(jù)綁定控件,只要能夠熟練運(yùn)用Repeater控件其它的綁定控件也就很簡(jiǎn)單了。
1、Repeater簡(jiǎn)介
Repeater 控件是基本模板化數(shù)據(jù)列表。 它不像GridView控件一樣能夠可視化的設(shè)計(jì)格式或樣式,因此開發(fā)時(shí)在控件模板中必須顯式聲明所有格式、格式和樣式標(biāo)記。另外Repeater控件沒有內(nèi)置選擇、排序、編輯、分頁(yè)等功能,它只提供了基本的數(shù)據(jù)綁定,但是它為開發(fā)人員提供了ItemCommand 事件,該事件支持在控件中收發(fā)命令。
想要綁定數(shù)據(jù),模板是必不可少的,Repeater控件同樣支持?jǐn)?shù)據(jù)模板,而且還可以在模板中添加想要的標(biāo)簽,它主要用法如下圖:


如何在ASP.NET中使用Repeater控件

Note:每個(gè) Repeater 控件必須定義 ItemTemplate。


如何在ASP.NET中使用Repeater控件

二、控件使用技巧
上文講解了Repeater基本的使用方法及它的一些基本特性,接下來做幾個(gè)經(jīng)典的示例來運(yùn)用Repeater控件。
1、數(shù)據(jù)綁定之刪除、編輯
該示例將會(huì)使用Asp.net的前臺(tái)和后臺(tái)結(jié)合來實(shí)現(xiàn)顯示數(shù)據(jù),并能夠編輯和刪除數(shù)據(jù)。
刪除頁(yè)面:


如何在ASP.NET中使用Repeater控件

編輯頁(yè)面:


如何在ASP.NET中使用Repeater控件

前臺(tái)代碼:在單擊編輯按鈕后將會(huì)進(jìn)入編輯頁(yè)面,頁(yè)面是由兩個(gè)Panel控件來控制,通過傳遞ID號(hào)的方式判斷顯示的是編輯頁(yè)面還是刪除頁(yè)面,另外前臺(tái)代碼通過設(shè)置控件的CommandArgument屬性來傳遞后臺(tái)所需要判斷的id號(hào)。

<body> 
  <form id="form1" runat="server"> 
  <div> 
    <asp:Repeater ID="userRepeat" runat="server" OnItemCommand="userRepeat_ItemCommand" OnItemDataBound="userRepeat_ItemDataBound"> 
      <HeaderTemplate> 
        <table border="1" > 
          <thead > 
            <tr> 
              <th>ID</th> 
              <th>內(nèi)容</th> 
              <th>操作</th> 
            </tr> 
          </thead> 
      </HeaderTemplate> 
      <ItemTemplate> 
        <asp:Panel ID="plItem" runat="server"> 
          <tr> 
            <td><asp:Label runat="server" ID="lblID" Text='<%#Eval("id") %>'></asp:Label></td> 
            <td><%#Eval("name") %></td> 
            <td> 
              <asp:LinkButton ID="lbtEdit" CommandName="Edit" CommandArgument='<%#Eval("id") %>' runat="server">編輯</asp:LinkButton> 
              <asp:LinkButton ID="lbtDelete" CommandName="Delete" CommandArgument='<%#Eval("id") %>' runat="server">刪除</asp:LinkButton> 
            </td> 
          </tr> 
        </asp:Panel> 
        <asp:Panel ID="plEdit" runat="server"> 
          <tr> 
            <td><asp:Label runat="server" ID="Label1" Text='<%#Eval("id") %>'></asp:Label></td> 
            <td><asp:TextBox ID="txtName" runat="server" Text='<%#Eval("name") %>'></asp:TextBox></td> 
            <td> 
              <asp:LinkButton ID="lbtCancel" CommandName="Cancel" CommandArgument='<%#Eval("id") %>' runat="server">取消</asp:LinkButton> 
              <asp:LinkButton ID="lbtUpdate" CommandName="Update" CommandArgument='<%#Eval("id") %>' runat="server">更新</asp:LinkButton> 
            </td> 
          </tr> 
        </asp:Panel> 
      </ItemTemplate> 
      <FooterTemplate> 
        </table> 
      </FooterTemplate> 
    </asp:Repeater> 
  </div> 
  </form> 
</body>

后臺(tái)代碼:在后臺(tái)代碼中很重要的兩個(gè)事件是ItemCommand和ItemDataBound,其中ItemCommand負(fù)責(zé)接收前臺(tái)傳進(jìn)來的按鈕命令,根據(jù)命令的參數(shù)來設(shè)置后臺(tái)傳遞的id,并在ItemDataBound中來驗(yàn)證id判斷切換顯示Panel。

using System; 
using System.Collections.Generic; 
using System.Data; 
using System.Data.SqlClient; 
using System.Web; 
using System.Web.UI; 
using System.Web.UI.WebControls; 
 
namespace WebApplication4 
{ 
  public partial class EditPage : System.Web.UI.Page 
  { 
    private int id = 0; //保存指定行操作所在的ID號(hào) 
    /// <summary> 
    /// 窗體加載時(shí)綁定數(shù)據(jù) 
    /// </summary> 
    /// <param name="sender"></param> 
    /// <param name="e"></param> 
    protected void Page_Load(object sender, EventArgs e) 
    { 
      if (!Page.IsPostBack) 
      { 
        this.DataBindToRepeater();//將數(shù)據(jù)綁定到Repeater控件上 
      } 
    } 
 
    /// <summary> 
    /// 將數(shù)據(jù)源綁定Repeater控件上 
    /// </summary> 
    private void DataBindToRepeater() { 
      //使用using語(yǔ)句進(jìn)行數(shù)據(jù)庫(kù)連接 
      using (SqlConnection sqlCon=new SqlConnection("server=.;database=MyBlog;uid=sa;pwd=1")) 
      { 
        sqlCon.Open(); //打開數(shù)據(jù)庫(kù)連接 
 
        SqlCommand sqlcom = new SqlCommand();  //創(chuàng)建數(shù)據(jù)庫(kù)命令對(duì)象 
        sqlcom.CommandText = "select * from match"; //為命令對(duì)象指定執(zhí)行語(yǔ)句 
        sqlcom.Connection = sqlCon; //為命令對(duì)象指定連接對(duì)象 
 
        this.userRepeat.DataSource = sqlcom.ExecuteReader();  //為Repeater對(duì)象指定數(shù)據(jù)源 
        this.userRepeat.DataBind(); //綁定數(shù)據(jù)源 
      } 
    } 
 
    /// <summary> 
    /// Repeater控件命令事件 
    /// </summary> 
    /// <param name="source"></param> 
    /// <param name="e"></param> 
    protected void userRepeat_ItemCommand(object source, RepeaterCommandEventArgs e) 
    { 
      //獲取命令文本,判斷發(fā)出的命令為何種類型,根據(jù)命令類型調(diào)用事件 
      if (e.CommandName=="Edit") //編輯命令 
      { 
        id = int.Parse(e.CommandArgument.ToString());  //獲取命令I(lǐng)D號(hào) 
      } 
      else if (e.CommandName=="Cancel")  //取消更新命令 
      { 
        id = -1; 
      } 
      else if(e.CommandName=="Delete")  //刪除行內(nèi)容命令 
      { 
        id = int.Parse(e.CommandArgument.ToString());  //獲取刪除行的ID號(hào) 
        //刪除選定的行,并重新指定綁定操作 
        this.DeleteRepeater(id); 
      } 
      else if (e.CommandName == "Update") //更新行內(nèi)容命令 
      { 
        //獲取更新行的內(nèi)容和ID號(hào) 
        string strText = ((TextBox)e.Item.FindControl("txtName")).Text.Trim(); 
        int intId=int.Parse(((Label)e.Item.FindControl("lblID")).Text); 
        //更新Repeater控件的內(nèi)容 
        this.UpdateRepeater(strText,intId); 
      } 
 
      //重新綁定控件上的內(nèi)容 
      this.DataBindToRepeater(); 
    } 
 
    /// <summary> 
    /// 刪除行內(nèi)容 
    /// </summary> 
    /// <param name="intId">刪除行所在內(nèi)容的ID</param> 
    private void DeleteRepeater(int intId) { 
      using (SqlConnection sqlCon = new SqlConnection("server=.;database=MyBlog;uid=sa;pwd=1")) 
      { 
        sqlCon.Open(); //打開數(shù)據(jù)庫(kù)連接 
 
        SqlCommand sqlcom = new SqlCommand();  //創(chuàng)建數(shù)據(jù)庫(kù)命令對(duì)象 
        sqlcom.CommandText = "delete from match where id=@id"; //為命令對(duì)象指定執(zhí)行語(yǔ)句 
        sqlcom.Connection = sqlCon; //為命令對(duì)象指定連接對(duì)象 
 
        //創(chuàng)建參數(shù)集合,并向sqlcom中添加參數(shù)集合 
        SqlParameter sqlParam = new SqlParameter("@id", intId); 
        sqlcom.Parameters.Add(sqlParam); 
 
        sqlcom.ExecuteNonQuery();  //指定更新語(yǔ)句 
 
      } 
    } 
 
    /// <summary> 
    /// 更新Repeater控件中的內(nèi)容 
    /// </summary> 
    /// <param name="strText">修改后的內(nèi)容</param> 
    /// <param name="intId">內(nèi)容所在行的ID號(hào)</param> 
    private void UpdateRepeater(string strText,int intId) { 
      using (SqlConnection sqlCon = new SqlConnection("server=.;database=MyBlog;uid=sa;pwd=1")) 
      { 
        sqlCon.Open(); //打開數(shù)據(jù)庫(kù)連接 
 
        SqlCommand sqlcom = new SqlCommand();  //創(chuàng)建數(shù)據(jù)庫(kù)命令對(duì)象 
        sqlcom.CommandText = "update match set name=@str where id=@id"; //為命令對(duì)象指定執(zhí)行語(yǔ)句 
        sqlcom.Connection = sqlCon; //為命令對(duì)象指定連接對(duì)象 
 
        //創(chuàng)建參數(shù)集合,并向sqlcom中添加參數(shù)集合 
        SqlParameter[] sqlParam = { new SqlParameter("@str", strText), new SqlParameter("@id", intId) }; 
        sqlcom.Parameters.AddRange(sqlParam); 
 
        sqlcom.ExecuteNonQuery();  //指定更新語(yǔ)句 
         
      } 
    } 
 
    /// <summary> 
    /// Repeater控件數(shù)據(jù)綁定時(shí)發(fā)生的事件 
    /// </summary> 
    /// <param name="sender"></param> 
    /// <param name="e"></param> 
    protected void userRepeat_ItemDataBound(object sender, RepeaterItemEventArgs e) 
    { 
      //判斷Repeater控件中的數(shù)據(jù)是否是綁定的數(shù)據(jù)源,如果是的話將會(huì)驗(yàn)證是否進(jìn)行了編輯操作 
      //ListItemType 枚舉表示在一個(gè)列表控件可以包括,例如 DataGrid、 DataList和 Repeater 控件的不同項(xiàng)目。  
      if (e.Item.ItemType==ListItemType.Item || e.Item.ItemType==ListItemType.AlternatingItem) 
      { 
        //獲取綁定的數(shù)據(jù)源,這里要注意上面使用sqlReader的方法來綁定數(shù)據(jù)源,所以下面使用的DbDataRecord方法獲取的 
        //如果綁定數(shù)據(jù)源是DataTable類型的使用下面的語(yǔ)句就會(huì)報(bào)錯(cuò). 
        System.Data.Common.DbDataRecord record = (System.Data.Common.DbDataRecord)e.Item.DataItem; 
        //DataTable類型的數(shù)據(jù)源驗(yàn)證方式 
        //System.Data.DataRowView record = (DataRowView)e.Item.DataItem; 
 
        //判斷數(shù)據(jù)源的id是否等于現(xiàn)在的id,如果相等的話證明現(xiàn)點(diǎn)擊了編輯觸發(fā)了userRepeat_ItemCommand事件 
        if (id == int.Parse(record["id"].ToString())) 
        { 
          ((Panel)e.Item.FindControl("plItem")).Visible = false; 
          ((Panel)e.Item.FindControl("plEdit")).Visible = true; 
        } 
        else 
        { 
          ((Panel)e.Item.FindControl("plItem")).Visible = true; 
          ((Panel)e.Item.FindControl("plEdit")).Visible = false; 
        } 
      } 
    } 
  } 
}

2、分頁(yè)--PageDataSource
前臺(tái)代碼:使用原始的html文本,并添加了一個(gè)Literal標(biāo)簽,用來動(dòng)態(tài)添加并指定html標(biāo)簽。
頁(yè)面截圖:


如何在ASP.NET中使用Repeater控件

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
  <title></title> 
  <style type="text/css"> 
 
    .pageBar 
    { 
      margin-top: 10px; 
    } 
    .pageBar a 
    { 
      color: #333; 
      font-size: 12px; 
      margin-right: 10px; 
      padding: 4px; 
      border: 1px solid #ccc; 
      text-decoration: none; 
    } 
  </style> 
</head> 
<body> 
  <form id="form1" runat="server"> 
  <div> 
     
    <asp:Repeater ID="Repeater1" runat="server" > 
      <HeaderTemplate> 
        <table border="1" cellpadding="0" cellspacing="0" > 
          <tr> 
            <th >ID</th> 
            <th >內(nèi)容</th> 
          </tr> 
      </HeaderTemplate> 
      <ItemTemplate> 
        <tr> 
          <td><asp:Label ID="lblId" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"id") %>' ></asp:Label></td> 
          <td><%# DataBinder.Eval(Container.DataItem,"name") %></td> 
        </tr> 
      </ItemTemplate> 
      <FooterTemplate> 
        </table> 
      </FooterTemplate> 
    </asp:Repeater> 
     
  </div> 
  <div class="pageBar"> 
    <asp:Literal ID="ltlPageBar" runat="server"></asp:Literal> 
  </div> 
  </form> 
</body> 
</html>

后臺(tái)代碼:Repeater控件的數(shù)據(jù)源是PagedDataSource對(duì)象,在頁(yè)面加載時(shí)為該對(duì)象動(dòng)態(tài)指定了分頁(yè)的屬性,并使用Literal標(biāo)簽來動(dòng)態(tài)指定每個(gè)標(biāo)簽跳轉(zhuǎn)頁(yè)的鏈接。


using System; 
using System.Collections.Generic; 
using System.Data; 
using System.Data.SqlClient; 
using System.Text; 
using System.Web; 
using System.Web.UI; 
using System.Web.UI.WebControls; 
 
namespace WebApplication4 
{ 
  public partial class PageDemo : System.Web.UI.Page 
  { 
    private string id = ""; 
    protected void Page_Load(object sender, EventArgs e) 
    { 
      if (!Page.IsPostBack) 
      { 
        //設(shè)置當(dāng)前頁(yè)的索引 
        int pageIndex = 1; 
        try 
        { 
          //獲取當(dāng)前索要跳轉(zhuǎn)頁(yè)的索引號(hào) 
          pageIndex = Convert.ToInt32(Request.QueryString["Page"]); 
          //如果是第0頁(yè)將會(huì)跳轉(zhuǎn)入第1頁(yè) 
          if (pageIndex <= 0) 
          { 
            pageIndex = 1; 
          } 
        } 
        catch 
        { 
          pageIndex = 1; 
        } 
 
        DataTable dt = this.GetDataTable(); //獲取綁定的數(shù)據(jù)表 
 
        PagedDataSource pds = new PagedDataSource();  //創(chuàng)建分頁(yè)數(shù)據(jù)源對(duì)象         
        pds.DataSource = dt.DefaultView;  //為數(shù)據(jù)源對(duì)象設(shè)置數(shù)據(jù)源 
        pds.AllowPaging = true; //對(duì)象允許分頁(yè) 
        pds.PageSize = 2;  //設(shè)置對(duì)象每頁(yè)顯示的大小 
        pds.CurrentPageIndex = pageIndex - 1; //設(shè)置數(shù)據(jù)源的當(dāng)前頁(yè) 
 
        //向Repeater控件上綁定分頁(yè)數(shù)據(jù)源控件 
        this.Repeater1.DataSource = pds; 
        this.Repeater1.DataBind(); 
 
        //使用Literal標(biāo)簽來動(dòng)態(tài)指定每個(gè)標(biāo)簽跳轉(zhuǎn)頁(yè)的鏈接 
        ltlPageBar.Text = this.GetPageBar(pds); 
      } 
    } 
 
    /// <summary> 
    /// 獲取每個(gè)標(biāo)簽上的跳轉(zhuǎn)頁(yè)的鏈接地址 
    /// </summary> 
    /// <param name="pds">分頁(yè)數(shù)據(jù)源對(duì)象</param> 
    /// <returns>分頁(yè)操作按鈕的html文本</returns> 
    private string GetPageBar(PagedDataSource pds) 
    { 
      string pageBar = string.Empty; //聲明頁(yè)面標(biāo)簽文本 
      int currentPageIndex = pds.CurrentPageIndex + 1;  //獲取當(dāng)前頁(yè)索引 
 
      //判斷首頁(yè)的鏈接頁(yè)面 
      if (currentPageIndex == 1) //如果該頁(yè)為第一頁(yè),則證明它為首頁(yè) 
      { 
        pageBar += "<a href=\"javascript:void(0)\">首頁(yè)</a>"; 
      } 
      else  
      { 
        //如果不是首頁(yè),首頁(yè)鏈接的地址將會(huì)為1 
        pageBar += "<a href=\"" + Request.CurrentExecutionFilePath + "?Page=1\">首頁(yè)</a>"; 
      } 
 
      //判斷上一頁(yè)鏈接的地址 
      if ((currentPageIndex - 1) < 1) //如果上一頁(yè)小于1則鏈接到第一頁(yè) 
      { 
        pageBar += "<a href=\"javascript:void(0)\">上一頁(yè)</a>"; 
      } 
      else 
      { 
        //如果上一頁(yè)地址不是1將會(huì)鏈接到上一頁(yè) 
        pageBar += "<a href=\"" + Request.CurrentExecutionFilePath + "?Page=" + (currentPageIndex - 1) + "\">上一頁(yè)</a>"; 
      } 
 
      //指定下一頁(yè)的鏈接地址 
      if ((currentPageIndex + 1) > pds.PageCount) 
      { 
        //如果下一頁(yè)的地址大于總頁(yè)數(shù),將會(huì)連接到首頁(yè) 
        pageBar += "<a href=\"javascript:void(0)\">下一頁(yè)</a>"; 
      } 
      else 
      { 
        //否則的話鏈接到下一頁(yè) 
        pageBar += "<a href=\"" + Request.CurrentExecutionFilePath + "?Page=" + (currentPageIndex + 1) + "\">下一頁(yè)</a>"; 
      } 
 
      //指定末頁(yè)的鏈接地址 
      if (currentPageIndex == pds.PageCount) 
      { 
        pageBar += "<a href=\"javascript:void(0)\">末頁(yè)</a>"; 
      } 
      else 
      { 
        pageBar += "<a href=\"" + Request.CurrentExecutionFilePath + "?Page=" + pds.PageCount + "\">末頁(yè)</a>"; 
      } 
 
      return pageBar; //返回html文本 
    } 
 
    /// <summary> 
    /// 獲取數(shù)據(jù)源,重新鏈接數(shù)據(jù) 
    /// </summary> 
    /// <returns>DataTable,數(shù)據(jù)源</returns> 
    private DataTable GetDataTable() 
    { 
      DataTable dt = new DataTable(); //創(chuàng)建數(shù)據(jù)庫(kù)表 
      using (SqlConnection con = new SqlConnection("server=.;DataBase=MyBlog;uid=sa;pwd=1;")) 
      { 
 
        con.Open(); //打開數(shù)據(jù)庫(kù)鏈接 
 
        SqlCommand sqlCom = new SqlCommand();  //聲明并創(chuàng)建數(shù)據(jù)庫(kù)命令集 
        StringBuilder sqlStr = new StringBuilder(); //聲明sql語(yǔ)句 
        sqlStr.Append("select * from match");  //獲取sql語(yǔ)句 
 
        sqlCom.CommandText = sqlStr.ToString(); //為sqlcommand對(duì)象指定sql語(yǔ)句 
 
        sqlCom.Connection = con;  //為sqlcommand對(duì)象指定鏈接對(duì)象 
        SqlDataAdapter sqlDa = new SqlDataAdapter(sqlCom); //聲明數(shù)據(jù)庫(kù)適配器 
        SqlCommandBuilder sqlBuilder = new SqlCommandBuilder(sqlDa); 
        sqlDa.Fill(dt); //填充表 
      } 
 
      return dt; 
    } 
 
  } 
}

看完上述內(nèi)容,你們掌握如何在ASP.NET中使用Repeater控件的方法了嗎?如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝各位的閱讀!

網(wǎng)站欄目:如何在ASP.NET中使用Repeater控件-創(chuàng)新互聯(lián)
分享路徑:http://muchs.cn/article46/psieg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供關(guān)鍵詞優(yōu)化、用戶體驗(yàn)、響應(yīng)式網(wǎng)站ChatGPT、搜索引擎優(yōu)化、外貿(mào)建站

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

網(wǎng)站建設(shè)網(wǎng)站維護(hù)公司