AJAX實現留言板資訊展開

例項說明
留言板是目前網路比較流行的、方便的、快捷的一種用來儲存留言的網路工具。使用者可以通過留言板為網站管理人員留言，也可以作為使用者與管理員交流的通訊工具。留言板通常應用在企業入口網站、電子商務銷售平臺網等網站。本例項開發的留言板如圖所示。

圖留言板的資訊展開

技術要點
DynamicPopulate控制元件提供了一種動態效果，能通過WebService或訪問伺服器端程式碼獲取一段HTML文字，並替換掉目標控制元件上原來的內容。DynamicPopulate控制元件的主要屬性及說明如表所示，

表 DynamicPopulate控制元件的屬性及說明

屬性
說明

TargetControlID
將具備“動態呈現”的Panel控制元件的值

ClearContentsDuringUpdate
當更新時，是否清除目標元素中的既有HTML內容。若沒有指定，將會自動清除 HTML內容，預設值為true

SerivcePath
將要呼叫的Web服務的URL。如果呼叫一個頁面方法，就不用設定些屬性

SerivceMethod
Web服務方法或頁面方法的名稱

PopulateTriggerControlID
一個選擇的屬性，用來指定某個控制元件被單擊時，要觸發目標元素進行動態呈現

UpdatingCssClass
在非同步呼叫（Asynchronous Call）時，欲套用到目標元素的CSS類屬性

CustomScript
替換原本將要呼叫的Web服務方法或頁面方法，改呼叫指定的指令碼（Script），它必須計算機為一個字串值

ContextKey
將傳遞給Web方法的任意字串值。比方說，動態呈現欲顯示一個繫結到資料的Repeater, 那麼所傳入的字串值可以是目前該行資料的ID值

實現過程
（1）新建一個AJAX網站，命名為07，預設窗體為Default.aspx。

（2）在Default.aspx窗體中主要新增一個ScriptManager控制元件、一個UpdatePanel控制元件和一個GridView控制元件，分別用於管理頁面中的AJAX控制元件、實現區域性更新、顯示留言板資訊。

（3）對GridView控制元件進行編輯列，新增一個TemplateField項。

（4）編輯GridView模板，在模板中設計程式碼如下：

        /table>

（5）建立一個Web服務，命名為Return.asmx。在WEB服務中建立GetReplyByMessage方法來實現留言板中的資訊展開。程式碼如下：

    [WebMethod]
    public string GetReplyByMessage(string contextKey)
    {
        OleDbConnection conn = new OleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("Ex18_07.mdb"));
        OleDbDataAdapter da = new OleDbDataAdapter("select * from tb_reply where messageID = " + contextKey + " Order by CreateDate DESC", conn);
        DataSet ds = new DataSet();
        da.Fill(ds);

        if (ds == null || ds.Tables.Count <= 0 || ds.Tables[0].Rows.Count <= 0)
        {
            return string.Empty;
        }
        StringBuilder returnHtml = new StringBuilder();
        foreach (DataRow row in ds.Tables[0].Rows)
        {
            returnHtml.Append("

");
        }
        return returnHtml.ToString();
    }

（6）在Default.aspx.cs檔案獲取資料庫中的留言資訊，實現程式碼如下：

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            OleDbConnection conn = new OleDbConnection(@"Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("Ex18_07.mdb"));
            OleDbDataAdapter da = new OleDbDataAdapter("select * from tb_Message Order by CreateDate DESC", conn);
            DataSet ds = new DataSet();
            da.Fill(ds);
            GridView1.DataSource = ds;
            GridView1.DataBind();
        }
    }

來自 “ ITPUB部落格 ” ，連結：http://blog.itpub.net/12639172/viewspace-442642/，如需轉載，請註明出處，否則將追究法律責任。