ASP.net中的AJAX學習記錄六 無重新整理的資料編輯（GridView和DetailsView結合執行個體）

標籤：blog   class   code   c   java   tar   

本篇部落格是仿照書中執行個體，實現GridView和DetailsView結合無重新整理的資料編輯效果，頁面效果：當點擊GridView1的行或換頁時，都會引發DetailsView1的資料繫結顯示至頁面，同時當使用DetailsView1編輯、刪除、添加時，也會引起GridView1的重新綁定，整體頁面實現無重新整理。

         頁面配置：

        1.建立AJAX視窗，命名為：“NoRefreshEdit.aspx”。要想實現頁面無重新整理編輯，就必須使用兩個Updatepanel。

        2.在NoRefreshEdit.aspx頁面中加入一個一行二列的表，分別在每個儲存格中放入一個Updatepanel。

        3.在Updatepanel1中加入一個表，最好加入一個資料數較多的表，方便你體會換頁的重新整理效果，我使用的是tb_info表，按照我習慣的做法，直接將它拖入到Updatepanel1中，自動產生綁定好的GridView1和sqldatasource1.開啟GridView1中的選擇、分頁功能。

        4.在Updatepanel2中放置一個sqldatasource2，將sqldatasource2的連接字串也綁定到tb_info表上，開始配置sqldatasource2。單擊“進階”按鈕，選中產生Insert、Update、Delete語句，單擊“where”按鈕，將ID綁定為GridView1的SelectedValue事件觸發的id值。

        5.拖放一個DetailsView1放入Updatepanel2中，將DetailsView1的資料來源配置為sqldatasource2，啟動編輯、刪除、插入功能。

        6.將Updatepanel1的UpdateMode屬性改為：conditional；將Updatepanel2的UpdateMode屬性也改為conditional，同時在Updatepanel2的Triggers中加入兩個Async-Postback，ControlID都是GridView1，Eventname分別是SelectedIndexChanged和PageIndexChanged，也就是說，當GridView1選擇行和頁碼改變後，都會發生Updatepanel2的重新整理，同時DetailsView1也會顯示出來。

         頁面配置到此，下面看一下cs代碼：

 1public partial class NoRefreshEdit : System.Web.UI.Page
 2{
 3    protected void Page_Load(object sender, EventArgs e)
 4    {
 5
 6    }
 7    protected void DetailsView1_ItemDeleted(object sender, DetailsViewDeletedEventArgs e)
 8    {
 9        GridView1.DataBind();
10        UpdatePanel1.Update();
11    }
12    protected void DetailsView1_ItemInserted(object sender, DetailsViewInsertedEventArgs e)
13    {
14        GridView1.DataBind();
15        UpdatePanel1.Update();
16    }
17    protected void DetailsView1_ItemUpdated(object sender, DetailsViewUpdatedEventArgs e)
18    {
19        GridView1.DataBind();
20        UpdatePanel1.Update();
21    }
22}
23

     那什麼要編寫這兩行的代碼，原因有二：1.DetailsView1並非是Updatepanel1的Triggers，所以它的任何動作不會重新整理Updatepanel1控制項，2.即使DetailsView1成為了Updatepanel1的Triggers，它的動作可以導致Updatepanel1的重新整理，Updatepanel1重新整理時也會因為GridView1控制項沒有重新綁定sqldatasource1，而持續顯示上一次的列表。所以我們要同時讓Updatepanel1重新整理，也要讓GridView1重新綁定。

     當Updatepanel的UpdateMode改為conditional時，除了可以使用Triggers中設定來要求何時重新整理外，還可以直接於程式碼中調用其update函數來要求該Updatepanel重新整理。