asp.net ajax1.0基础回顾（三）：UpdatePanel的基本用法

在asp.net ajax中，UpdatePanel控件可以让大部分服务器端控件拥有AJAX能力，只需要把服务端拽到UpdatePanel中或在UpdatePanel上注册一下即可，下面通过示例来说明。

1．创建Web应用程序名为AspNetAjaxDemo的工程，如下图所示：

<a target="_blank" href="http://blog.51cto.com/attachment/201106/181128791.jpg"></a>

2．页面UpdatePanelDemo.aspx的前端代码如下： 

&lt;body&gt;

    &lt;form id="form1" runat="server"&gt;

    &lt;h3&gt;UpdatePanel控件基本用法&lt;/h3&gt;

    &lt;asp:ScriptManager ID="ScriptManagerDemo" runat="server"&gt;

    &lt;/asp:ScriptManager&gt;

    &lt;div style="width:500px; padding:10px;"&gt;

        &lt;asp:UpdatePanel ID="UpdatePanelDemo" runat="server" RenderMode="Inline" 

            UpdateMode="Conditional"&gt;

            &lt;ContentTemplate&gt;

                &lt;asp:TextBox ID="txtInner" runat="server"&gt;&lt;/asp:TextBox&gt;

                &amp;nbsp;&lt;asp:Button ID="btnInnerAsych" runat="server" Text="内部异步" 

                    /&gt;&amp;nbsp;&amp;nbsp;&lt;asp:Button ID="btnInnerSync" 

                    runat="server" Text="内部同步" /&gt;

                &lt;asp:Label ID="lblMessage" runat="server"&gt;&lt;/asp:Label&gt;

            &lt;/ContentTemplate&gt;

            &lt;Triggers&gt;

                &lt;asp:AsyncPostBackTrigger ControlID="btnOuterAsyn" EventName="Click" /&gt;

                &lt;asp:PostBackTrigger ControlID="btnInnerSync" /&gt;

            &lt;/Triggers&gt;

        &lt;/asp:UpdatePanel&gt;

    &lt;/div&gt;

    &lt;asp:Button ID="btnOuterAsyn" runat="server" Text="外部异步" 

        /&gt;

    &lt;/form&gt;

&lt;/body&gt;

3．页面UpdatePanelDemo.aspx的后端代码：<b></b>

 namespace AspNetAjaxDemo

{

    public partial class _Default : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

        }

        protected void btnInnerAsych_Click(object sender, EventArgs e)

            this.lblMessage.Text = String.Format("来自内部异步 - Hello {0}", this.txtInner.Text);

        protected void btnOuterAsyn_Click(object sender, EventArgs e)

            this.lblMessage.Text = String.Format("来自外部异步 - Hello {0}", this.txtInner.Text);

        protected void btnInnerSync_Click(object sender, EventArgs e)

            this.lblMessage.Text = String.Format("来自内部同步 - Hello {0}", this.txtInner.Text);

    }

}

4.开始测试。

<a target="_blank" href="http://blog.51cto.com/attachment/201106/181817315.jpg"></a>

说明：

1）UpdatePanel可以其内部的服务器端控件自动获取AJAX能力，还可以将UpdatePanel外部的服务器控件获取AJAX能力，只需要将服务器端控件在UpdatePanel上注册一下即可完成，具体操作有两种：一种是手动添加以上页面中的btnOuterAsyn按钮的相关代码，或通过如下图片操作和设置来完成： 

<a target="_blank" href="http://blog.51cto.com/attachment/201106/181841296.jpg"></a>

2）UpdatePanel还可以将内部的服务器端控件失去AJAX能力，完成常规的POSTBACK操作，同样只需要将外部的服务器控件在UpdatePanel上注册一下即可，如下图片所示。

<a target="_blank" href="http://blog.51cto.com/attachment/201106/181903331.jpg"></a>

本文转自 彭金华  51CTO博客，原文链接:http://blog.51cto.com/pengjh/591511