Repeater控件
?Repeater控件和DataList控件,可以用來一次顯示一組數據項。比如,可以用它們顯示一個數據表中的所有行。?
??? Repeater控件完全由模板驅動,提供了最大的靈活性,可以任意設置它的輸出格式。DataList控件也由模板驅動,和Repeater不同的是,DataList默認輸出是HTML表格,DataList將數據源中的記錄輸出為HTML表格一個個的單元格。
1. Repeater控件顯示數據
??? 要使用Repeater控件顯示數據,必須創建ItemTemplate。如下所示:?
例1:使用ItemTemplate顯示數據?
<asp:Repeater?ID="Repeater1"?runat="server"?DataSourceID="SqlDataSource1">
????<ItemTemplate>
????????<div?class="movies">
????????????<h1><%#Eval("Title")?%></h1>
????????</div>
????????<b>Directed?by:</b><%#Eval("Director")?%>
????????<br?/>
????????<b>Description:</b><%#Eval("Description")?%>
????</ItemTemplate>
</asp:Repeater>?
??? 以上代碼,通過瀏覽器可以看到,.net不會改變里面的結構,模板里面怎么排列,數據顯示也怎么樣顯示。它的HTML如下所示:、?
<div?class="movies">
?????<h1>史密斯行動</h1>
</div>
<b>Directed?by:</b>Doug?Liman
<br?/>
<b>Description:</b>約翰(布拉德?皮特?Brad?Pitt?飾)和
<div?class="movies">
?????<h1>暴力街區</h1>
</div>
<b>Directed?by:</b>Luc?Besson
<br?/>
<b>Description:</b>臥虎藏龍而又凌亂不堪的13區…?
??? 所以,Repeater的靈活性就在這個上面,完全可以自由發揮,想怎么顯示就怎么顯示。例如,都可以把它放在Javascript代碼中?
<script?type=”text/javascript”>
????<asp:Repeater?id=”rptPhotos”?Runat=”server”>
?????????<ItemTemplate>
??????????????<%#?Eval(“Name”,?"photos.push(‘Photos/{0}’)")?%>
?????????</ItemTemplate>
????</asp:Repeater>
</script>?
?? 以上,photos是一個Javscript數組對象。Repeater生成的數據,最后就像以下這樣:?
<script?type="text/javascript">
????????photos.push('Photos/1.jpg');
????????photos.push('Photos/2.jpg');
????????photos.push('Photos/3.jpg');
????????photos.push('Photos/4.jpg');
????????…
</script>?
?
2. Repeater中使用模板
??? Repeater支持以下5種模板?
????? ● ItemTemplate : 對每一個數據項進行格式設置 【Formats each item from the data source.】?
????? ● AlternatingItemTemplate : 對交替數據項進行格式設置?
????? ● SeparatorTemplate : 對分隔符進行格式設置?
????? ● HeaderTemplate : 對頁眉進行格式設置?
????? ● FooterTemplate : 對頁腳進行格式設置?
?? 以上,英文中使用了Formats item from datasource這樣的話,就說明Repeater控件主要是用來對數據進行Format的,控制數據怎么樣排列,怎么樣顯示。?
?? Repeater必須使用的是Itemtemplate,其它的類型模板按需添加。?
例2:以下通過CSS控制,顯示了一個比較不錯的列表項:?
<style?type="text/css">
????html?{
????????background-color:Silver
????}
????.content?{
????????width:600px;
????????border:soild?1px?black;
????????background-color:White;
????}
????.movies?{
????????border-collapse:collapse;
????}
????.movies?th,.movies?td?{
????????padding:10px;
????????border-bottom:1px?solid?black;
????}
????.alternating?{
????????background-color:#eeeeee;
????????}
</style>
<div?class="content">
<asp:Repeater?ID="Repeater1"?runat="server"?DataSourceID="SqlDataSource1">
????<HeaderTemplate>?<!--?顯示頭部?-->
????????<table?class="movies">?<!--?table頭部聲明-->
?????????<tr>
????????????<th>Movie?Title</th>
????????????<th>Movie?Director</th>
????????????<th>Box?Office?Totals</th>
?????????</tr>
????</HeaderTemplate>
????<ItemTemplate>??<!--?數據行?-->
????????<tr>
????????????<td><%#Eval("Title")?%></td>
????????????<td><%#Eval("Director")?%></td>
????????????<td><%#Eval("BoxOfficeTotals","{0:c}")?%></td>?<!--?格式化為貨幣形式?-->
????????</tr>
????</ItemTemplate>
????<AlternatingItemTemplate>?<!--?交錯行?-->
????????<tr?class="alternating">
????????????<td><%#Eval("Title")?%></td>
????????????<td><%#Eval("Director")?%></td>
????????????<td><%#Eval("BoxOfficeTotals","{0:c}")?%></td>
????????</tr>
????</AlternatingItemTemplate>
????<FooterTemplate>?<!--?腳注行?-->
????????</table>????<!--?table尾?-->
????</FooterTemplate>
</asp:Repeater>
</div>?
??? 以上,顯示的樣式如下所示:?
?
3. Repeater控件的事件處理
??? Repeater控件有以下事件:?
????? ● DataBinding : Repeater控件綁定到數據源時觸發?
????? ● ItemCommand : Repeater控件中的子控件觸發事件時觸發?
????? ● ItemCreated : 創建Repeater每個項目時觸發??
????? ● ItemDataBound : Repeater控件的每個項目綁定數據時觸發?
例3:使用Repeater控件的事件支持編輯、更新、刪除?
=== 后臺代碼 ===?
<script?runat=”server”>
????//?The?name?of?the?primary?key?column
????string?DataKeyName?=?"Id";
????///?把每個列的ID存儲在ViewState["Keys"]對象中,ViewState["Keys"]是一個HashTable對象。
????Hashtable?Keys
????{
????????get
????????{
????????????if?(ViewState["Keys"]?==?null)
????????????????ViewState["Keys"]?=?new?Hashtable();
????????????return?(Hashtable)ViewState["Keys"];
????????}
????}
????///?Repeater控件綁定到數據源時觸發
????///?每次更新,刪除,增加后,都會觸發這個事件,Keys中的值都會被清除。
????///?在ItemDataBound事件發生時,被新的值填充
????protected?void?rptMovies_DataBinding(object?sender,?EventArgs?e)
????{
????????Keys.Clear();
????}
????///?每個項目綁定數據時觸發
????protected?void?rptMovies_ItemDataBound(object?sender,?RepeaterItemEventArgs?e)
????{
????????//?如果是數據列,把ID列取出來,加入到ViewState["Keys"]中
????????//?DataBinder.Eval是在運行時計算數據綁定表達式。這樣的用法要記住.
????????if?(e.Item.ItemType?==?ListItemType.Item?||?e.Item.ItemType?==ListItemType.AlternatingItem)
????????{
????????????Keys.Add(e.Item.ItemIndex,?DataBinder.Eval(e.Item.DataItem,?"Id"));
????????}
????}
????///?當點擊Update,Insert,Delete按鈕時觸發
????protected?void?rptMovies_ItemCommand(object?source,?RepeaterCommandEventArgs?e)
????{
????????switch?(e.CommandName)
????????{
????????????case?"Update":
????????????????UpdateMovie(e);
????????????????break;
????????????case?"Insert":
????????????????InsertMovie(e);
????????????????break;
????????????case?"Delete":
????????????????DeleteMovie(e);
????????????????break;
????????}
????}
????///?Update?a?movie?record
????protected?void?UpdateMovie(RepeaterCommandEventArgs?e)
????{
????????//?從一個數據項中獲得相應的控件
????????TextBox?txtTitle?=?(TextBox)e.Item.FindControl("txtTitle");
????????TextBox?txtDirector?=?(TextBox)e.Item.FindControl("txtDirector");
????????CheckBox?chkInTheaters?=?(CheckBox)e.Item.FindControl("chkInTheaters");
????????//?填充sqlDataSource的UpdateParameters值
????????srcMovies.UpdateParameters["Id"].DefaultValue?=
????????Keys[e.Item.ItemIndex].ToString();
????????srcMovies.UpdateParameters["Title"].DefaultValue?=?txtTitle.Text;
????????srcMovies.UpdateParameters["Director"].DefaultValue?=?txtDirector.Text;
????????srcMovies.UpdateParameters["InTheaters"].DefaultValue?=
????????chkInTheaters.Checked.ToString();
????????//?進行Update
????????srcMovies.Update();
????}
????///?Insert?a?movie?record
????protected?void?InsertMovie(RepeaterCommandEventArgs?e)
????{
????????//?從一個數據項中獲得相應的控件
????????TextBox?txtTitle?=?(TextBox)e.Item.FindControl("txtTitle");
????????TextBox?txtDirector?=?(TextBox)e.Item.FindControl("txtDirector");
????????CheckBox?chkInTheaters?=?(CheckBox)e.Item.FindControl("chkInTheaters");
????????//?填充sqlDataSource的InsertParameters值
????????srcMovies.InsertParameters["Title"].DefaultValue?=?txtTitle.Text;
????????srcMovies.InsertParameters["Director"].DefaultValue?=?txtDirector.Text;
????????srcMovies.InsertParameters["InTheaters"].DefaultValue?=
????????chkInTheaters.Checked.ToString();
????????//?Fire?the?InsertCommand
????????srcMovies.Insert();
????}
????///?Delete?a?movie?record
????protected?void?DeleteMovie(RepeaterCommandEventArgs?e)
????{
????????//?設置sqlDataSource的DeleteParameters值
????????srcMovies.DeleteParameters["Id"].DefaultValue?=??Keys[e.Item.ItemIndex].ToString();
????????//?Fire?the?DeleteCommand
????????srcMovies.Delete();
????}
</script>?
=== 前臺頁面 ===
<asp:Repeater?id="rptMovies"?DataSourceID="srcMovies"?Runat="server"
??????OnItemCommand="rptMovies_ItemCommand"?OnItemDataBound="rptMovies_ItemDataBound"?OnDataBinding="rptMovies_DataBinding">
????<HeaderTemplate>
????????<table?class="movies">
????????<tr>?<th>Title</th><th>Director</th><th>In?Theaters</th>?</tr>
????</HeaderTemplate>
????<ItemTemplate>
????????<tr>
????????????<td><asp:TextBox?id="txtTitle"?Text='<%#Eval("Title")%>'?Runat="server"?/></td>???????????
????????????<td><asp:TextBox?id="txtDirector"?Text='<%#Eval("Director")%>'?Runat="server"?/></td>
????????????<td><asp:CheckBox?id="chkInTheaters"?Checked='<%#Eval("InTheaters")%>'Runat="server"?/></td>
????????????<td><asp:LinkButton?id="lnkUpdate"?CommandName="Update"?Text="Update"?Runat="server"?/>
???????????????? | <asp:LinkButton?id="lnkDelete"?CommandName="Delete"?Text="Delete"
??????????????????????????????????OnClientClick="return?confirm(‘Are?you?sure?');"?Runat="server"?/></td>
????????</tr>
????</ItemTemplate>
????<FooterTemplate>
????????<tr>
????????????<td><asp:TextBox?id="txtTitle"?Runat="server"?/></td>
????????????<td><asp:TextBox?id="txtDirector"?Runat="server"?/></td>
????????????<td><asp:CheckBox?id="chkInTheaters"?Runat="server"?/></td>
????????????<td><asp:LinkButton?id="lnkInsert"?CommandName="Insert"?Text="Insert"?Runat="server"?/></td>
????????</tr>
????????</table>
????</FooterTemplate>
</asp:Repeater>
<asp:SqlDataSource?id="srcMovies"?ConnectionString="<%$?ConnectionStrings:Movies?%>"
????SelectCommand="SELECT?Id,Title,Director,InTheaters?FROM?Movies"
????UpdateCommand="UPDATE?Movies?SET?Title=@Title,Director=@Director,InTheaters=@InTheaters?WHERE?Id=@Id"
????InsertCommand="INSERT?Movies(Title,Director,InTheaters)?VALUES(@Title,@Director,@InTheaters)"
????DeleteCommand="DELETE?Movies?WHERE?Id=@Id"?Runat="server">
????<UpdateParameters>
????????<asp:Parameter?Name="Id"?/>
????????<asp:Parameter?Name="Title"?/>
????????<asp:Parameter?Name="Director"?/>
????????<asp:Parameter?Name="InTheaters"?/>
????</UpdateParameters>
????<InsertParameters>
????????<asp:Parameter?Name="Title"?/>
????????<asp:Parameter?Name="Director"?/>
????????<asp:Parameter?Name="InTheaters"?/>
????</InsertParameters>
????<DeleteParameters>
????????<asp:Parameter?Name="Id"?/>
????</DeleteParameters>
</asp:SqlDataSource>
repeater控件靈活性很大,不止可以循環表格,還可以循環div等其他內容:
例如循環div:
代碼:
<asp:Repeater ID="Repeater1" runat="server"><HeaderTemplate></HeaderTemplate><ItemTemplate><div class="div1"><%#Eval("NickName") %></div></ItemTemplate><FooterTemplate></FooterTemplate></asp:Repeater>repeater的Command用法:
1、ItemCommand事件 - Repeater中所有可以觸發事件的控件,都會來執行這一個事件
2、CommandName - 隨意的起名,在后臺事件中按照這個名字來區分你按下的是哪一個功能按鈕
3、CommandArgument - 事件數據,通常放置主鍵值,在后臺使用 e.CommandArgument來獲取主鍵數據
?
轉載于:https://www.cnblogs.com/bosamvs/p/5689381.html
總結
以上是生活随笔為你收集整理的Repeater控件的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 移动网站用backbone还是angul
- 下一篇: [转]Chrome 控制台console