一、Repeater控件的用法流程及實(shí)例:
1、首先建立一個(gè)網(wǎng)站,新建一個(gè)網(wǎng)頁(yè)index.aspx。
2、添加或者建立APP_Data數(shù)據(jù)文件,然后將用到的數(shù)據(jù)庫(kù)文件放到APP_Data文件夾中。
3、打開(kāi)數(shù)據(jù)庫(kù)企業(yè)管理器,數(shù)據(jù)庫(kù)服務(wù)器為local(.),然后將APP_Data文件夾中的數(shù)據(jù)庫(kù)附加到數(shù)據(jù)庫(kù)服務(wù)器中。
4、添加Ling to SQL類。
5、打開(kāi)視圖,服務(wù)器資源管理器,右擊數(shù)據(jù)庫(kù)服務(wù)器,選擇添加連接,然后選擇數(shù)據(jù)庫(kù)服務(wù)器、數(shù)據(jù)庫(kù)類型,及數(shù)據(jù)庫(kù)表,然后完成。
6、將需要用到的表,全部選中,然后拖動(dòng)到.dbml為后綴的文件中,然后保存。到這一步,數(shù)據(jù)表的附加及與網(wǎng)站的連接就完成了。
目標(biāo):通過(guò)使用Repeater數(shù)據(jù)控件,讓數(shù)據(jù)表中的數(shù)據(jù)在表格中顯示。
1、添加樣式文件,然后在樣式文件中,書(shū)寫(xiě)表格的樣式代碼。
2、在index.aspx的設(shè)計(jì)模式下,插入表格,通常插入兩行(一行為標(biāo)題行,一行為內(nèi)容行),因?yàn)镽epeater控件會(huì)自動(dòng)循環(huán)的。然后在源代碼界面中,將剛插入的表格的第一行的單元格改為,標(biāo)題單元格,即將<td>改為<th>。
3、選中表格,然后選擇格式,然后選擇附加樣式表。接下來(lái),需要將源代碼中的頭部中樣式代碼刪除,將行樣式刪除,并且書(shū)寫(xiě)新建的樣式表中的類或這ID到表格中。
4、然后,將光標(biāo)放到table前面,雙擊repeater控件,這樣Repeater控件的代碼就添加到了Table代碼的前面,然后分別為Repeater控件添加頭部模版(<HeaderTemplate></HeaderTemplate> )、列表模版(<ItemTemplate></ItemTemplate>)和尾部模版( <FooterTemplate> </FooterTemplate>)。
注意:
頭部模版放置表格開(kāi)始及第一行標(biāo)題行(<table><tr><th></th></tr>);列表模版放置表格第二行(<tr></tr>);尾部模版放置表個(gè)結(jié)束(</table>)。
插入表格時(shí)只需插入兩行即可,顯示數(shù)據(jù)時(shí)是根據(jù)數(shù)據(jù)庫(kù)表循環(huán)顯示的。項(xiàng)目模板,會(huì)進(jìn)行循環(huán)顯示,放置表格第二行。
5、然后在標(biāo)題行的單元格中書(shū)寫(xiě)將要顯示的數(shù)據(jù)庫(kù)中字段的別名,在內(nèi)容行的單元格中書(shū)寫(xiě)數(shù)據(jù)庫(kù)中的字段名,方式為:
<td><%#Eval("數(shù)據(jù)庫(kù)字段名") %></td>
核心代碼為:
<body> <form id="form1" runat="server"> <div> <!--光標(biāo)放到table前面,雙擊repeater控件,三個(gè)缺一不可--> <asp:Repeater ID="Repeater1" runat="server"> <HeaderTemplate><!--頭部模板,放表格開(kāi)始及第一行標(biāo)題--> <table class="ts"><!--插入表格時(shí)只需插入兩行即可,顯示數(shù)據(jù)時(shí)是根據(jù)數(shù)據(jù)庫(kù)表循環(huán)顯示的--> <tr> <th> 學(xué)號(hào)</th> <th> 姓名</th> <th> 性別</th> <th> 籍貫</th> <th> 年齡</th> </tr></HeaderTemplate> <ItemTemplate><!--項(xiàng)目模板,會(huì)進(jìn)行循環(huán)顯示,放置表格第二行--> <tr> <td> <%#Eval("number") %> <!--HTMl中插入其他代碼需要用<% %>括起來(lái),Eval("數(shù)據(jù)庫(kù)中的字段名")--> </td> <td> <%#Eval("name")%> </td> <td> <%#Eval("sex")%> </td> <td> <%#Eval("place")%></td> <td> <%#Eval("age")%> </td> </tr> </ItemTemplate> <FooterTemplate><!--底部模板--> </table> <!--表格結(jié)束部分--> </FooterTemplate> </asp:Repeater> </div> </form></body>
注意:
HTMl中插入其他代碼需要用<% %>括起來(lái)。
6、然后在index.aspx.cs的Page_Load()事件中綁定數(shù)據(jù)源。
核心代碼為:
public partial class citynumber : System.Web.UI.Page{ DataClassesDataContext dc = new DataClassesDataContext(); protected void Page_Load(object sender, EventArgs e) { var query = from c in dc.city select c; Repeater1.DataSource = query; Repeater1.DataBind(); }}
7、運(yùn)行index.aspx頁(yè)面即可看到數(shù)據(jù)庫(kù)中各字段信息。
二、通過(guò)Table顯示數(shù)據(jù)庫(kù)中的字段時(shí),為字段添加超鏈接。
1、新建兩個(gè)頁(yè)面,index.aspx 頁(yè)面和Cities.aspx頁(yè)面。
index.aspx頁(yè)面代碼:
<body> <asp:Repeater ID="Repeater1" runat="server"> <HeaderTemplate> <table class="ts"> <tr> <th> 省份名稱</th> <th> 省份編號(hào)</th> </tr> </HeaderTemplate> <ItemTemplate> <tr> <td> <a href='Cities.aspx?pro=<%#Eval("proID") %>' target="_blank"><%#Eval("proName") %></a></td><!--添加超鏈接,超鏈接放到內(nèi)容的兩邊--> <td> <%#Eval("proID")%></td> </tr> </ItemTemplate> <FooterTemplate> </table> </FooterTemplate> </asp:Repeater> <form id="form1" runat="server"> <div> </div> </form></body>
index.aspx.cs中的代碼:
public partial class index : System.Web.UI.Page{ DataClassesDataContext dc = new DataClassesDataContext(); protected void Page_Load(object sender, EventArgs e) { var query = from c in dc.province select c; Repeater1.DataSource = query; Repeater1.DataBind(); }}
Cities.aspx頁(yè)面中的代碼:
<body> <form id="form1" runat="server"> <div> <asp:GridView ID="GridView1" runat="server" CellPadding="4" ForeColor="#333333" GridLines="None" Width="909px"> <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" /> <RowStyle BackColor="#EFF3FB" /> <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" /> <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" /> <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" /> <EditRowStyle BackColor="#2461BF" /> <AlternatingRowStyle BackColor="White" /> </asp:GridView> </div> </form></body>
Cities.aspx.cs頁(yè)面中的代碼:
public partial class Cities : System.Web.UI.Page{ DataClassesDataContext dc = new DataClassesDataContext(); protected void Page_Load(object sender, EventArgs e) { int id =Convert.ToInt32(Request.QueryString["pro"].ToString()); var query = from c in dc.city where c.proID == id select c; GridView1.DataSource = query; GridView1.DataBind(); }}
然后運(yùn)行index.aspx頁(yè)面,通過(guò)單擊超鏈接就跳轉(zhuǎn)到了Cities.aspx,在該頁(yè)面顯示信息。
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持VeVb武林網(wǎng)。
新聞熱點(diǎn)
疑難解答
圖片精選