天天看點

新瓶舊酒ASP.NET AJAX(1) - 簡單地過一下每個控件(ScriptManager、ScriptManagerProxy

<a href="http://webabcd.blog.51cto.com/1787395/344663" target="_blank">[索引頁]</a>

<a href="http://down.51cto.com/data/100916" target="_blank">[源碼下載下傳]</a>

新瓶舊酒ASP.NET AJAX(1) - 簡單地過一下每個控件(ScriptManager、ScriptManagerProxy、UpdatePanel、 UpdateProgress和Timer)

介紹

ASP.NET AJAX就5個控件,分别是ScriptManager、ScriptManagerProxy、UpdatePanel、UpdateProgress和Timer。先簡單地過一下。

關鍵

1、ScriptManager 和ScriptManagerProxy

    ·一個頁隻能有一個ScriptManager(包含了所有腳本資源),要放到任何用到AJAX的控件的前面。

    ·如果把它放到母版頁,而内容頁需要與其不同的配置的話,則應在内容頁使用ScriptManagerProxy。 

    ·ScriptManager預設EnablePartialRendering="true"。

    ·ScriptManager的 AllowCustomErrorsRedirect="true"的時候,出現異常就會轉到web.config裡customErrors中defaultRedirect所指的位址。

2、 UpdatePanel

    ·UpdatePanel内放置需要被重新整理的控件,如果是其内部控件事件導緻其重新整理,則不用另外做什麼設定,因為UpdatePanel預設ChildrenAsTriggers="true"。

    ·如果是UpdatePanel外部控件導緻其重新整理的話,則應設定 Triggers。

    ·在Triggers内,如果AsyncPostBackTrigger未設定EventName,則為其指定控件的預設事件。 

    ·UpdatePanel預設UpdateMode="Always",需要的話應設定UpdateMode="Conditional"。

    ·RenderMode="Block"對應div;RenderMode="Inline"對應span

3、UpdateProgress

    ·預設,任何回發,當有延遲的時候則顯示UpdateProgress裡的ProgressTemplate。

    ·要與某UpdatePanel關聯則設定 AssociatedUpdatePanelID屬性。

    ·DynamicLayout為true則用“display:none;”隐藏;DynamicLayout為false則用 “visibility:hidden;”隐藏。

    ·預設情況下,例如有2個異步回發,如果第1個還沒有執行完畢就執行第2個的話,則會先取消第1個異步回發。

4、Timer

    ·Interval:間隔時間,機關(毫秒);每一個間隔時間後将觸發 Tick事件。

    ·Timer要放在其所重新整理的UpdatePanel内部;放外面的話要設定UpdatePanel的Triggers。

5、其它

    ·内容頁擷取母版頁的ScriptManager:ScriptManager.GetCurrent(Page)

    ·後置代碼處對UpdatePanel程式設計,例: ScriptManager.GetCurrent(this).RegisterAsyncPostBackControl(this.Button1); ScriptManager.GetCurrent (this).RegisterPostBackControl(this.Button2); this.UpdatePanel1.Update();

示例

1、最簡單的示例

&lt;%@ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="Sample.aspx.cs" 

        Inherits="Overview_Sample" Title="最簡單的示例" %&gt; 

&lt;asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server"&gt; 

        &lt;ul&gt; 

                &lt;li&gt;之前要有ScriptManager(包含了所有腳本資源),我把它放到母版頁了。内容頁如需不同配置則應使用ScriptManagerProxy。&lt;/li&gt; 

                &lt;li&gt;最簡單的示例,拖個UpdatePanel進來。在 UpdatePanel内拖個GridView,并設定其資料源即可。 &lt;/li&gt; 

        &lt;/ul&gt; 

        &lt;asp:UpdatePanel ID="UpdatePanel1" runat="server"&gt; 

                &lt;ContentTemplate&gt; 

                        &lt;asp:GridView ID="GridView1" runat="server" AllowPaging="True" AllowSorting="True" 

                                DataSourceID ="SqlDataSource1"&gt; 

                                &lt;Columns&gt; 

                                     &amp; nbsp;&lt;asp:CommandField ShowEditButton="True" ShowSelectButton="True" /&gt; 

                                &lt;/Columns&gt; 

                        &lt;/asp:GridView&gt; 

                &lt;/ContentTemplate&gt; 

        &lt;/asp:UpdatePanel&gt; 

        &lt;asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="&lt;% $ ConnectionStrings:connstr %&gt;" 

                DeleteCommand="DELETE FROM [Products] WHERE [ProductID] = @ProductID" InsertCommand="INSERT INTO [Products]    ([ProductName], [QuantityPerUnit], [UnitPrice], [Discontinued]) VALUES    (@ProductName, @QuantityPerUnit, @UnitPrice, @Discontinued)" 

                SelectCommand="SELECT    [ProductID], [ProductName], [QuantityPerUnit], [UnitPrice], [Discontinued] FROM    [Products]" 

                UpdateCommand="UPDATE    [Products] SET [ProductName] = @ProductName, [QuantityPerUnit] = @QuantityPerUnit,    [UnitPrice] = @UnitPrice, [Discontinued] = @Discontinued WHERE [ProductID]    = @ProductID"&gt; 

                &lt;DeleteParameters&gt; 

                        &lt;asp:Parameter Name="ProductID" Type="Int32" /&gt; 

                &lt;/DeleteParameters&gt; 

                &lt;UpdateParameters&gt; 

                        &lt;asp:Parameter Name="ProductName" Type="String" /&gt; 

                        &lt;asp:Parameter Name="QuantityPerUnit" Type="String" /&gt; 

                        &lt;asp:Parameter Name="UnitPrice" Type="Decimal" /&gt; 

                        &lt;asp:Parameter Name="Discontinued" Type="Boolean" /&gt; 

                &lt;/UpdateParameters&gt; 

                &lt;InsertParameters&gt; 

                &lt;/InsertParameters&gt; 

        &lt;/asp:SqlDataSource&gt; 

&lt;/asp:Content&gt;

2、UpdatePanel

&lt;%@ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="UpdatePanel.aspx.cs" 

        Inherits="Overview_UpdatePanel" Title="UpdatePanel" %&gt; 

                &lt;li&gt;UpdatePanel内放置需要被重新整理的控件,如果是其内部控件事件導緻其重新整理,則不用另外做什麼設定,因為UpdatePanel預設ChildrenAsTriggers="true"。&lt;/li&gt; 

                &lt;li&gt;如果是UpdatePanel外部控件導緻其重新整理的話,則應設定Triggers。&lt;/li&gt; 

                &lt;li&gt;在Triggers内,如果AsyncPostBackTrigger 未設定EventName,則為其指定控件的預設事件。&lt;/li&gt; 

                &lt;li&gt;UpdatePanel預設UpdateMode="Always",需要的話應設定UpdateMode="Conditional"。&lt;/li&gt; 

                &lt;li&gt;RenderMode="Block"對應div; RenderMode="Inline"對應span&lt;/li&gt; 

                &lt;contenttemplate&gt; 

                        &lt;fieldset&gt; 

                                &lt;legend&gt;我在UpdatePanel裡&lt;/legend&gt; 

                                &lt;asp:Label ID="Label1" runat="server" Text="我是 Label"&gt;&lt;/asp:Label&gt; 

                        &lt;/fieldset&gt; 

                &lt;/contenttemplate&gt; 

                &lt;triggers&gt; 

                        &lt;%--如果沒設定 EventName,則取預設事件,Button的預設事件為Click-- %&gt; 

                        &lt;asp:AsyncPostBackTrigger ControlID="Button1" /&gt; 

                &lt;/triggers&gt; 

        &lt;p&gt; 

                 &lt;/p&gt; 

        &lt;fieldset&gt; 

                &lt;legend&gt;我在UpdatePanel外&lt;/legend&gt; 

                &lt;asp:Button ID="Button1" runat="server" Text="按鈕" OnClick="Button1_Click" /&gt; 

        &lt;/fieldset&gt; 

        &lt;%--嵌套UpdatePanel-- %&gt; 

        &lt;asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional"&gt; 

                                &lt;legend&gt;外圍UpdatePanel&lt;/legend&gt; 

                                &lt;asp:Label ID="Label2" runat="server" Text="我是 Label"&gt;&lt;/asp:Label&gt; 

                                &lt;asp:Button ID="Button2" runat="server" Text="按鈕" OnClick="Button2_Click" /&gt; 

                                &lt;asp:UpdatePanel ID="UpdatePanel3" runat="server"&gt; 

                                     &amp; nbsp;&lt;ContentTemplate&gt; 

                                     &amp; nbsp;        &lt;fieldset&gt; 

                                     &amp; nbsp;                &lt;legend&gt;嵌套UpdatePanel&lt;/legend&gt; 

                                     &amp; nbsp;                &lt;asp:Label ID="Label3" runat="server" Text="我是Label"&gt;&lt;/asp:Label&gt; 

                                     &amp; nbsp;                &lt;asp:Button ID="Button3" runat="server" Text="按鈕" OnClick="Button3_Click" /&gt; 

                                     &amp; nbsp;        &lt;/fieldset&gt; 

                                     &amp; nbsp;&lt;/ContentTemplate&gt; 

                                &lt;/asp:UpdatePanel&gt; 

&lt;%@ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="UpdateProgress.aspx.cs" 

        Inherits="Overview_UpdateProgress" Title="UpdateProgress" %&gt; 

                &lt;li&gt;預設,任何回發,當有延遲的時候則顯示 UpdateProgress裡的ProgressTemplate。&lt;/li&gt; 

                &lt;li&gt;要與某UpdatePanel關聯則設定 AssociatedUpdatePanelID屬性。&lt;/li&gt; 

                &lt;li&gt;DynamicLayout為true則用“display:none; ”隐藏;DynamicLayout為false則用“visibility:hidden;”隐藏。&lt;/li&gt; 

                &lt;li&gt;預設情況下,例如有2個異步回發,如果第1 個還沒有執行完畢就執行第2個的話,則會先取消第1個異步回發。&lt;/li&gt; 

                                &lt;legend&gt;UpdatePanel1&lt;/legend&gt; 

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

                                &lt;br /&gt; 

                                &lt;asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" /&gt; 

        &lt;asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1" 

                DynamicLayout="false"&gt; 

                &lt;ProgressTemplate&gt; 

                        &lt;p&gt; 

                                UpdatePanel1更新中    

                        &lt;/p&gt; 

                &lt;/ProgressTemplate&gt; 

        &lt;/asp:UpdateProgress&gt; 

        &lt;asp:UpdatePanel ID="UpdatePanel2" runat="server"&gt; 

                                &lt;legend&gt;UpdatePanel2&lt;/legend&gt; 

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

                                &lt;asp:Button ID="Button2" runat="server" Text="Button" OnClick="Button2_Click" /&gt; 

        &lt;asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2" 

                DynamicLayout="true"&gt; 

                                UpdatePanel2更新中    

        &lt;asp:UpdatePanel ID="UpdatePanel3" runat="server"&gt; 

                                &lt;legend&gt;UpdatePanel3&lt;/legend&gt; 

                                &lt;asp:Label ID="Label3" runat="server" Text="Label3"&gt;&lt;/asp:Label&gt;&lt;br /&gt; 

                                &lt;asp:Button ID="Button3" runat="server" Text="Button" OnClick="Button3_Click" /&gt; 

        &lt;asp:UpdateProgress ID="UpdateProgress3" runat="server"&gt; 

                        有延遲我就更新 

&lt;%@ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="Timer.aspx.cs" 

        Inherits="Overview_Timer" Title="Timer" %&gt; 

                &lt;li&gt;Interval:間隔時間,機關(毫秒);每一個間隔時間後将觸發Tick事件 &lt;/li&gt; 

                &lt;li&gt;Timer要放在其所重新整理的UpdatePanel内部;放外面的話要設定UpdatePanel的Triggers。&lt;/li&gt; 

                                &lt;p&gt; 

                                     &amp; nbsp;内部Timer 

                                     &amp; nbsp;&lt;asp:Timer ID="Timer1" runat="server" OnTick="Timer1_Tick" Interval="1000"&gt; 

                                     &amp; nbsp;&lt;/asp:Timer&gt; 

                                &lt;/p&gt; 

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

注:以上示例涉及到後置代碼的,其作用都是用來重新整理相關的Label的,是以略掉了。

OK

     本文轉自webabcd 51CTO部落格,原文連結:http://blog.51cto.com/webabcd/344667,如需轉載請自行聯系原作者

繼續閱讀