新瓶旧酒ASP.NET AJAX(1) - 简单地过一下每个控件(ScriptManager、ScriptManagerProxy、UpdatePanel、UpdateProgress和Timer)

[索引页]
[源码下载]


新瓶旧酒ASP.NET AJAX(1) - 简单地过一下每个控件(ScriptManager、ScriptManagerProxy、UpdatePanel、 UpdateProgress和Timer)


作者: webabcd


介绍
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、其它
    ·要在UpdatePanel中使用Validator的话,请参看 http://blogs.msdn.com/mattgi/archive/2007/01/23/asp-net-ajax-validators.aspx
    ·内容页获取母版页的ScriptManager:ScriptManager.GetCurrent(Page)
    ·后置代码处对UpdatePanel编程,例: ScriptManager.GetCurrent(this).RegisterAsyncPostBackControl(this.Button1); ScriptManager.GetCurrent (this).RegisterPostBackControl(this.Button2); this.UpdatePanel1.Update();
    · Internet Explorer Developer Toolbar下载
    · Fiddler下载
    · Web Development Helper下载


示例
1、最简单的示例
<% @ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="Sample.aspx.cs"
    Inherits
="Overview_Sample" Title="最简单的示例" 
%>

< asp:Content  ID ="Content1"  ContentPlaceHolderID ="ContentPlaceHolder1"  runat ="Server" >
    
< ul >
        
< li > 之前要有ScriptManager(包含了所有脚本资源),我把它放到母版页了。内容页如需不同配置则应使用ScriptManagerProxy。 </ li >
        
< li > 最简单的示例,拖个UpdatePanel进来。在 UpdatePanel内拖个GridView,并设置其数据源即可。  </ li >
    
</ ul >
    
< asp:UpdatePanel  ID ="UpdatePanel1"  runat ="server" >
        
< ContentTemplate >
            
< asp:GridView  ID ="GridView1"  runat ="server"  AllowPaging ="True"  AllowSorting ="True"
                DataSourceID
="SqlDataSource1" >
                
< Columns >
                   & nbsp;
< asp:CommandField  ShowEditButton ="True"  ShowSelectButton ="True"   />
                
</ Columns >
            
</ asp:GridView >
        
</ ContentTemplate >
    
</ asp:UpdatePanel >
    
< asp:SqlDataSource  ID ="SqlDataSource1"  runat ="server"  ConnectionString ="<% $ ConnectionStrings:connstr %>"
        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" >
        
< DeleteParameters >
            
< asp:Parameter  Name ="ProductID"  Type ="Int32"   />
        
</ DeleteParameters >
        
< UpdateParameters >
            
< asp:Parameter  Name ="ProductName"  Type ="String"   />
            
< asp:Parameter  Name ="QuantityPerUnit"  Type ="String"   />
            
< asp:Parameter  Name ="UnitPrice"  Type ="Decimal"   />
            
< asp:Parameter  Name ="Discontinued"  Type ="Boolean"   />
            
< asp:Parameter  Name ="ProductID"  Type ="Int32"   />
        
</ UpdateParameters >
        
< InsertParameters >
            
< asp:Parameter  Name ="ProductName"  Type ="String"   />
            
< asp:Parameter  Name ="QuantityPerUnit"  Type ="String"   />
            
< asp:Parameter  Name ="UnitPrice"  Type ="Decimal"   />
            
< asp:Parameter  Name ="Discontinued"  Type ="Boolean"   />
        
</ InsertParameters >
    
</ asp:SqlDataSource >
</ asp:Content >

2、UpdatePanel
<% @ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="UpdatePanel.aspx.cs"
    Inherits
="Overview_UpdatePanel" Title="UpdatePanel" 
%>

< asp:Content  ID ="Content1"  ContentPlaceHolderID ="ContentPlaceHolder1"  runat ="Server" >
    
< ul >
        
< li > UpdatePanel内放置需要被刷新的控件,如果是其内部控件事件导致其刷新,则不用另外做什么设置,因为UpdatePanel默认ChildrenAsTriggers="true"。 </ li >
        
< li > 如果是UpdatePanel外部控件导致其刷新的话,则应设置Triggers。 </ li >
        
< li > 在Triggers内,如果AsyncPostBackTrigger 未设置EventName,则为其指定控件的默认事件。 </ li >
        
< li > UpdatePanel默认UpdateMode="Always",需要的话应设置UpdateMode="Conditional"。 </ li >
        
< li > RenderMode="Block"对应div; RenderMode="Inline"对应span </ li >
    
</ ul >
    
< asp:UpdatePanel  ID ="UpdatePanel1"  runat ="server" >
        
< contenttemplate >
            
< fieldset >
                
< legend > 我在UpdatePanel里 </ legend >
                
< asp:Label  ID ="Label1"  runat ="server"  Text ="我是 Label" ></ asp:Label >
            
</ fieldset >
        
</ contenttemplate >
        
< triggers >
            
<% --如果没设置 EventName,则取默认事件,Button的默认事件为Click-- %>
            
< asp:AsyncPostBackTrigger  ControlID ="Button1"   />
        
</ triggers >
    
</ asp:UpdatePanel >
    
< p >
        
&nbsp; </ p >
    
< fieldset >
        
< legend > 我在UpdatePanel外 </ legend >
        
< asp:Button  ID ="Button1"  runat ="server"  Text ="按钮"  OnClick ="Button1_Click"   />
    
</ fieldset >
    
< p >
        
&nbsp; </ p >
    
<% --嵌套UpdatePanel-- %>
    
< asp:UpdatePanel  ID ="UpdatePanel2"  runat ="server"  UpdateMode ="Conditional" >
        
< contenttemplate >
            
< fieldset >
                
< legend > 外围UpdatePanel </ legend >
                
< asp:Label  ID ="Label2"  runat ="server"  Text ="我是 Label" ></ asp:Label >
                
< asp:Button  ID ="Button2"  runat ="server"  Text ="按钮"  OnClick ="Button2_Click"   />
                
< asp:UpdatePanel  ID ="UpdatePanel3"  runat ="server" >
                   & nbsp;
< ContentTemplate >
                   & nbsp;    
< fieldset >
                   & nbsp;        
< legend > 嵌套UpdatePanel </ legend >
                   & nbsp;        
< asp:Label  ID ="Label3"  runat ="server"  Text ="我是Label" ></ asp:Label >
                   & nbsp;        
< asp:Button  ID ="Button3"  runat ="server"  Text ="按钮"  OnClick ="Button3_Click"   />
                   & nbsp;    
</ fieldset >
                   & nbsp;
</ ContentTemplate >
                
</ asp:UpdatePanel >
            
</ fieldset >
        
</ contenttemplate >
    
</ asp:UpdatePanel >
</ asp:Content >

3、UpdateProgress
<% @ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="UpdateProgress.aspx.cs"
    Inherits
="Overview_UpdateProgress" Title="UpdateProgress" 
%>

< asp:Content  ID ="Content1"  ContentPlaceHolderID ="ContentPlaceHolder1"  runat ="Server" >
    
< ul >
        
< li > 默认,任何回发,当有延迟的时候则显示 UpdateProgress里的ProgressTemplate。 </ li >
        
< li > 要与某UpdatePanel关联则设置 AssociatedUpdatePanelID属性。 </ li >
        
< li > DynamicLayout为true则用“display:none; ”隐藏;DynamicLayout为false则用“visibility:hidden;”隐藏。 </ li >
        
< li > 默认情况下,例如有2个异步回发,如果第1 个还没有执行完毕就执行第2个的话,则会先取消第1个异步回发。 </ li >
    
</ ul >
    
< asp:UpdatePanel  ID ="UpdatePanel1"  runat ="server" >
        
< ContentTemplate >
            
< fieldset >
                
< legend > UpdatePanel1 </ legend >
                
< asp:Label  ID ="Label1"  runat ="server"  Text ="Label1" ></ asp:Label >
                
< br  />
                
< asp:Button  ID ="Button1"  runat ="server"  Text ="Button"  OnClick ="Button1_Click"   />
            
</ fieldset >
        
</ ContentTemplate >
    
</ asp:UpdatePanel >
    
< asp:UpdateProgress  ID ="UpdateProgress1"  runat ="server"  AssociatedUpdatePanelID ="UpdatePanel1"
        DynamicLayout
="false" >
        
< ProgressTemplate >
            
< p >
                UpdatePanel1更新中
            
</ p >
        
</ ProgressTemplate >
    
</ asp:UpdateProgress >
    
< p >
        
&nbsp; </ p >
    
< asp:UpdatePanel  ID ="UpdatePanel2"  runat ="server" >
        
< ContentTemplate >
            
< fieldset >
                
< legend > UpdatePanel2 </ legend >
                
< asp:Label  ID ="Label2"  runat ="server"  Text ="Label2" ></ asp:Label >
                
< br  />
                
< asp:Button  ID ="Button2"  runat ="server"  Text ="Button"  OnClick ="Button2_Click"   />
            
</ fieldset >
        
</ ContentTemplate >
    
</ asp:UpdatePanel >
    
< asp:UpdateProgress  ID ="UpdateProgress2"  runat ="server"  AssociatedUpdatePanelID ="UpdatePanel2"
        DynamicLayout
="true" >
        
< ProgressTemplate >
            
< p >
                UpdatePanel2更新中
            
</ p >
        
</ ProgressTemplate >
    
</ asp:UpdateProgress >
    
< p >
        
&nbsp; </ p >
    
< asp:UpdatePanel  ID ="UpdatePanel3"  runat ="server" >
        
< ContentTemplate >
            
< fieldset >
                
< legend > UpdatePanel3 </ legend >
                
< asp:Label  ID ="Label3"  runat ="server"  Text ="Label3" ></ asp:Label >< br  />
                
< asp:Button  ID ="Button3"  runat ="server"  Text ="Button"  OnClick ="Button3_Click"   />
            
</ fieldset >
        
</ ContentTemplate >
    
</ asp:UpdatePanel >
    
< asp:UpdateProgress  ID ="UpdateProgress3"  runat ="server" >
        
< ProgressTemplate >
            有延迟我就更新
        
</ ProgressTemplate >
    
</ asp:UpdateProgress >
</ asp:Content >

4、Timer
<% @ Page Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="Timer.aspx.cs"
    Inherits
="Overview_Timer" Title="Timer" 
%>

< asp:Content  ID ="Content1"  ContentPlaceHolderID ="ContentPlaceHolder1"  runat ="Server" >
    
< ul >
        
< li > Interval:间隔时间,单位(毫秒);每一个间隔时间后将触发Tick事件  </ li >
        
< li > Timer要放在其所刷新的UpdatePanel内部;放外面的话要设置UpdatePanel的Triggers。 </ li >
    
</ ul >
    
< asp:UpdatePanel  ID ="UpdatePanel1"  runat ="server" >
        
< ContentTemplate >
            
< fieldset >
                
< legend > UpdatePanel1 </ legend >
                
< p >
                   & nbsp;内部Timer
                   & nbsp;
< asp:Timer  ID ="Timer1"  runat ="server"  OnTick ="Timer1_Tick"  Interval ="1000" >
                   & nbsp;
</ asp:Timer >
                
</ p >
                
< asp:Label  ID ="Label1"  runat ="server"  Text ="Label" ></ asp:Label >
            
</ fieldset >
        
</ ContentTemplate >
    
</ asp:UpdatePanel >
</ asp:Content >

注:以上示例涉及到后置代码的,其作用都是用来刷新相关的Label的,所以略掉了。


OK
[源码下载]

你可能感兴趣的:(progress)