一、Repeater控制項的用法流程及執行個體:
1、首先建立一個網站,建立一個網頁index.aspx。
2、添加或者建立APP_Data資料檔案,然後將用到的資料庫檔案放到APP_Data檔案夾中。
3、開啟資料庫企業管理器,資料庫伺服器為local(.),然後將APP_Data檔案夾中的資料庫附加到資料庫伺服器中。
4、添加Ling to SQL類。
5、開啟視圖,伺服器總管,右擊資料庫伺服器,選擇添加串連,然後選擇資料庫伺服器、資料庫類型,及資料庫表,然後完成。
6、將需要用到的表,全部選中,然後拖動到.dbml為尾碼的檔案中,然後儲存。到這一步,資料表的附加及與網站的串連就完成了。
目標:通過使用Repeater資料控制項,讓資料表中的資料在表格中顯示。
1、添加樣式檔案,然後在樣式檔案中,書寫表格的樣式代碼。
2、在index.aspx的設計模式下,插入表格,通常插入兩行(一行為標題列,一行為內容行),因為Repeater控制項會自動迴圈的。然後在原始碼介面中,將剛插入的表格的第一行的儲存格改為,標題儲存格,即將<td>改為<th>。
3、選中表格,然後選擇格式,然後選擇附加樣式表。接下來,需要將原始碼中的頭部中樣式代碼刪除,將行樣式刪除,並且書寫建立的樣式表中的類或這ID到表格中。
4、然後,將游標放到table前面,雙擊repeater控制項,這樣Repeater控制項的代碼就添加到了Table代碼的前面,然後分別為Repeater控制項添加頭部模版(<HeaderTemplate></HeaderTemplate> )、列表模版(<ItemTemplate></ItemTemplate>)和尾部模版( <FooterTemplate> </FooterTemplate>)。
注意:
頭部模版放置表格開始及第一列名行(<table><tr><th></th></tr>);列表模版放置表格第二行(<tr></tr>);尾部模版放置表個結束(</table>)。
插入表格時只需插入兩行即可,顯示資料時是根據資料庫表迴圈顯示的。項目模板,會進行迴圈顯示,放置表格第二行。
5、然後在標題列的儲存格中書寫將要顯示的資料庫中欄位的別名,在內容行的儲存格中書寫資料庫中的欄位名,方式為:
<td><%#Eval("資料庫欄位名") %></td>
核心代碼為:
<body> <form id="form1" runat="server"> <div> <!--游標放到table前面,雙擊repeater控制項,三個缺一不可--> <asp:Repeater ID="Repeater1" runat="server"> <HeaderTemplate><!--頭部模板,放表格開始及第一列名--> <table class="ts"><!--插入表格時只需插入兩行即可,顯示資料時是根據資料庫表迴圈顯示的--> <tr> <th> 學號</th> <th> 姓名</th> <th> 性別</th> <th> 籍貫</th> <th> 年齡</th> </tr></HeaderTemplate> <ItemTemplate><!--項目模板,會進行迴圈顯示,放置表格第二行--> <tr> <td> <%#Eval("number") %> <!--HTMl中插入其他代碼需要用<% %>括起來,Eval("資料庫中的欄位名")--> </td> <td> <%#Eval("name")%> </td> <td> <%#Eval("sex")%> </td> <td> <%#Eval("place")%></td> <td> <%#Eval("age")%> </td> </tr> </ItemTemplate> <FooterTemplate><!--底部模板--> </table> <!--表格結束部分--> </FooterTemplate> </asp:Repeater> </div> </form></body>
注意:
HTMl中插入其他代碼需要用<% %>括起來。
6、然後在index.aspx.cs的Page_Load()事件中綁定資料來源。
核心代碼為:
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、運行index.aspx頁面即可看到資料庫中各欄位資訊。
二、通過Table顯示資料庫中的欄位時,為欄位添加超連結。
1、建立兩個頁面,index.aspx 頁面和Cities.aspx頁面。
index.aspx頁面代碼:
<body> <asp:Repeater ID="Repeater1" runat="server"> <HeaderTemplate> <table class="ts"> <tr> <th> 省份名稱</th> <th> 省份編號</th> </tr> </HeaderTemplate> <ItemTemplate> <tr> <td> <a href='Cities.aspx?pro=<%#Eval("proID") %>' target="_blank"><%#Eval("proName") %></a></td><!--添加超連結,超連結放到內容的兩邊--> <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頁面中的代碼:
<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頁面中的代碼:
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(); }}
然後運行index.aspx頁面,通過單擊超連結就跳轉到了Cities.aspx,在該頁面顯示資訊。
以上就是本文的全部內容,希望對大家的學習有所協助,也希望大家多多支援雲棲社區。