ASP.NET-----Repeater數據控件的用法總結


一、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,在該頁面顯示信息。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM