[ASP.NET][C#]-使用Repeater製作留言板

今天要介紹的是使用Repeater物件,使用它來製作簡單的留言版

Repeater和DataList、DataGrid是一樣均是.net提供好用的資料庫資料輸出物件


首先,先設計一個簡單的資料表(今天範例是使用mysql)

Id(編號)	Message(留言)
1	Test
2	try

接下來,開始規劃Repeater，規劃之前先介紹一下各種屬性的定義

    頁首樣版
    資料樣板//此為定義資料庫的資料顯示格式
    分隔樣板
    隔行資料樣版
    頁尾樣版
    

從上述的屬性介紹中.大致可以了解到itemtemplate是整個Repeater最重要的一環

所以我們就著重在這個屬性的內容規劃.使用table來做版面的規劃.

如下圖:

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <h2 align="center">
        &nbsp;<asp:Repeater ID="Repeater1" runat="server">
    <ItemTemplate>
    <table style="width:36%; table-layout: fixed;">
            <tr>
                <td class="style9" style="background-image: url('留言板.jpg'); background-repeat: no-repeat">
                    <table style="width: 95%; height: 228px;" align="left">
                        <tr>
                            <td colspan="3">
                            </td>
                        </tr>
                        <tr>
                            <td>
                            </td>
                            <td class="style22" colspan="2"><%#Eval("id") %></td>
                        </tr>
                        <tr>
                            <td class="style18">
                            </td>
                            <td class="style20">
                                時間:</td>
                            <td class="style20">
                                IP:</td>
                        </tr>
                        <tr>
                            <td class="style23">
                                </td>
                            <td colspan="2" style="vertical-align: top; text-align: left" class="style24">
                                內容:<%#Eval("mess") %></td>
                        </tr>
                        <tr>
                            <td class="style13">
                                &nbsp;</td>
                            <td colspan="2" style="vertical-align: top; text-align: left">
                                &nbsp;</td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </ItemTemplate>
        </asp:Repeater>

最後一步,撰寫連結Repeater的程式碼.
1.先把MySql的函式庫加入參考並using

using MySql.Data.MySqlClient;

2.在Page_Load的事件寫入下列程式碼.就能Repeater物件做連結!

MySqlConnection sqlcon = new MySqlConnection("server=localhost;user id=test;password=test;database=test;port=3306;CharSet=utf8;");
            sqlcon.Open();
            MySqlDataAdapter sqlda = new MySqlDataAdapter();
            DataSet myds = new DataSet();
            sqlda.SelectCommand = new MySqlCommand("SELECT * FROM `message`", sqlcon);
            sqlda.Fill(myds);
            sqlcon.Close();
            Repeater1.DataSource = myds.Tables[0];
            Repeater1.DataBind();

完成圖:

使用Repeater這類的物件，能快速的完成資料的表現，在開發上速度上加快了許多。


參考資料:
1.http://www.dotblogs.com.tw/mis2000lab/archive/2008/04/24/3460.aspx
2.http://www.dotblogs.com.tw/shinyo.her/archive/2011/06/02/26978.aspx
3.http://msdn.microsoft.com/zh-tw/library/system.web.ui.webcontrols.repeater(v=vs.80).aspx

針對上述內容有更好的建議歡迎留言討論！

2011/06/06 By YC

轉載請註明出處