ASP.NET—015：ASP.NET中無刷新頁面實現

ASP.NET—015：ASP.NET中無刷新頁面實現

原文作者：楊友山

原文地址：http://blog.csdn.net/yysyangyangyangshan/article/details/39679823

前面也說過在asp.net中前後前交互的問題。使用了ajax.js的方法：$.post和$.ajax。

http://blog.csdn.net/yysyangyangyangshan/article/details/22755007和
http://blog.csdn.net/yysyangyangyangshan/article/details/22438077
這種方式對於少量控件的更新和取值，以及按鈕的操作事件等都比較適用。不過對於gridview控件的綁定就不方便了，使用gridview的databind在線程中不能綁定數據。所以這裡再介紹一種無刷新頁面的方法，也就是updatepanel控件。也是ajax中的。
不多說了，直接看用法。
1、准備工作。
需要准備如下三個dll。
System.Web.Extensions.Design.dll
System.Web.Extensions.dll
AjaxControlToolkit.dll
前兩個都好說，只要安裝ASPAJAXExtSetup 1.0.exe就有了，具體目錄在：安裝盤\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025下。
對於AjaxControlToolkit.dll則需要安裝AjaxControlToolkit-framework x.x。
本文是針對.net framework2.0的，所以下載AjaxControlToolkit-framework2.0 ，這個網上有帶源碼的。
下載地址：http://download.csdn.net/detail/yysyangyangyangshan/7991393
將這三個dll引用到工程中。AjaxControlToolkit.dll這裡下載的是源碼，需要自己把程序集生成為dll再引用進工程中來。
在工具箱中就有了如下控件：

2、 配置文件
web.config中需要增加如下節點
中：





1.0.61025.0要和ASPAJAXExtSetup安裝後的目錄版本對應。
3、頁面注冊
<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
Namespace="System.Web.UI" TagPrefix="asp" %>
使用方法如下：
這裡簡單實現以下：點擊按鈕，然後頁面文本框顯示當前時間。
工程：
001
前台：

<%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI" TagPrefix="asp" %>







    


    

後台：

  public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
           
        }


        protected void Btn_Time_Click(object sender, EventArgs e)
        {
            this.txtTime.Text = DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss");
        }
    }

web.config配置

這樣一來，按鈕的click事件後，頁面就不會整體刷新了。而updatepanel要注意寫法：

這樣不論是簡單的textbox，還是對gridview綁定都可以了。

另外，針對updatepanel之間的控件，如果有的需要局部刷新，有的需要整體頁面刷新，可以用到Triggers標簽，格式如下：

而每一次局部刷新完成後的事件也是可以加以利用的。如果想在刷新完後再做某些處理，可以在script中加如下代碼：

<script type="text/javascript">
    $(function () {
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
    });


    function EndRequestHandler() {
       //刷新後的操作
    }
  </script>

使用的例子見下文。
代碼下載：http://download.csdn.net/detail/yysyangyangyangshan/7991427