WEB开发网
开发学院网页设计JavaScript 使用 JavaScript 更新 UpdatePanel 阅读

使用 JavaScript 更新 UpdatePanel

 2010-09-14 13:20:15 来源:WEB开发网   
核心提示:在ASP.NET AJAX 機制中,UpdatePanel 有著相當重要的地位,使用 JavaScript 更新 UpdatePanel,它讓開發人員不用撰寫 AJAX 相關程式碼,就能享有 AJAX 的效果,如下範例傳入 UpdatePanel 的 ClientID 即可,實際執行的結果頁面就不會再閃爍了,一般包含在

在ASP.NET AJAX 機制中,UpdatePanel 有著相當重要的地位,它讓開發人員不用撰寫 AJAX 相關程式碼,就能享有 AJAX 的效果。一般包含在 UpdatePanel 中的子控制項,若子控制項有執行 PostBack 動作時,UpdatePanel 機制在前端會去攔截 __doPostBack 函式,使得控制項產生的 PostBack都會經由 UpdatePanel 統一處理局部更新的動作。

可是有時我們會需要透過 JavaScript 要求 UpdatePanel 做更新的動作,一般都會以為直接呼叫 __doPostBack 即可。以下以一個實例來做測試,我們在頁面的 UpdatePanel 放置一個 Label 來顯示最新時間。然後 Input (type=button)在 onclick 直接呼叫 __doPostBack 函式。

*.aspx

1    <asp:ScriptManagerID="ScriptManager1"runat="server"/>
2    <div>
3      <asp:UpdatePanelID="UpdatePanel1"runat="server">
4        <ContentTemplate>
5          ServerTime:
6          <asp:LabelID="Label1"runat="server"Text="Label"></asp:Label>
7        </ContentTemplate>
8      </asp:UpdatePanel>
9      <inputid="Button1"type="button"value="button"onclick="__doPostBack('','');"/>
10    </div>

*.aspx.vb

1  ProtectedSubPage_Load(ByValsenderAsObject,ByValeAsSystem.EventArgs)HandlesMe.Load
2    Label1.Text=Now.ToString()
3  EndSub

可是實際執行並不如預期,UpdatePanel 中的時間是更新了,可是頁面會產生閃爍的情形,這個 PostBack 並不會受 UpdatePanel 控管。

其實只要做一點修改就可以要求 UpdatePanel 做更新的動作,就是在 __doPostBack 函式的第一個引數 (eventTarget),如下範例傳入 UpdatePanel 的 ClientID 即可。實際執行的結果頁面就不會再閃爍了,因為 PostBack 動作已經在 UpdatePanel 的控管中。

<inputid="Button1"type="button"value="button"onclick="__doPostBack('UpdatePanel1','');"/>

UpdatePanelRefresh.rar下载:http://file.ddvip.com/2008_10/1224665246_ddvip_5201.rar

Tags:使用 JavaScript 更新

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接