Asp.net 简明教程
ASP.NET - Ajax Control
AJAX 代表异步 JavaScript 和 XML。这是一种跨平台技术,可以加快响应时间。 AJAX 服务器控件向页面添加将在浏览器中执行和处理的脚本。
然而,与其他 ASP.NET 服务器控件一样,这些 AJAX 服务器控件也可能具有与之关联的方法和事件处理程序,它们在服务器端处理。
Visual Studio IDE 中的控件工具箱包含一组称为“AJAX 扩展”的控件。
The ScriptManager Control
ScriptManager 控件是最重要的控件,必须在页面上存在才能使其他控件工作。
它具有基本语法:
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
如果从“添加项”对话框创建“启用 Ajax 的站点”或添加“AJAX Web 窗体”,则 Web 窗体自动包含脚本管理器控件。 ScriptManager 控件处理所有服务器端控件的客户端脚本。
The UpdatePanel Control
UpdatePanel 控件是一个容器控件,派生自 Control 类。它充当容器,用于容纳其中的子控件,并且没有自己的接口。当其中的控件触发回发时,UpdatePanel 会进行干预以异步启动回发并仅更新页面的那部分。
例如,如果按钮控件在更新面板内并且被单击,则只会影响更新面板内的控件,页面其他部分的控件不会受到影响。这称为部分回发或异步回发。
Example
在应用程序中添加一个 AJAX Web 窗体。它默认包含脚本管理器控件。插入一个更新面板。在更新面板控件内放置一个按钮控件和一个标签控件。在面板外放置另一组按钮和标签。
设计视图如下所示:
源文件如下:
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" />
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="btnpartial" runat="server" onclick="btnpartial_Click" Text="Partial PostBack"/>
<br />
<br />
<asp:Label ID="lblpartial" runat="server"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
<p> </p>
<p>Outside the Update Panel</p>
<p>
<asp:Button ID="btntotal" runat="server" onclick="btntotal_Click" Text="Total PostBack" />
</p>
<asp:Label ID="lbltotal" runat="server"></asp:Label>
</form>
两个按钮控件对事件处理程序具有相同代码:
string time = DateTime.Now.ToLongTimeString();
lblpartial.Text = "Showing time from panel" + time;
lbltotal.Text = "Showing time from outside" + time;
注意,当执行页面时,如果单击总回发按钮,它将同时更新两个标签中的时间,但是如果单击部分回发按钮,它只会更新更新面板内的标签。
一个页面可以包含多个更新面板,每个面板都包含其他控件,如网格,并显示数据的不同部分。
当发生总回发时,更新面板内容默认更新。可以通过更改控件的 UpdateMode 属性更改此默认模式。让我们看看更新面板的其他属性。
Properties of the UpdatePanel Control
下表显示了更新面板控件的属性:
Properties |
Description |
ChildrenAsTriggers |
此属性指示回发是否来自子控件,从而导致更新面板刷新。 |
ContentTemplate |
它是内容模板,定义了呈现更新面板时在更新面板中显示的内容。 |
ContentTemplateContainer |
检索动态创建的模板容器对象,并用于以编程方式添加子控件。 |
IsInPartialRendering |
指示面板是否正在作为部分回发的一部分进行更新。 |
RenderMode |
显示呈现模式。可用模式包括块和内联。 |
UpdateMode |
通过确定某些条件来获取或设置呈现模式。 |
Triggers |
定义集合触发对象,每个对象对应于一个事件,导致面板自动刷新。 |
Methods of the UpdatePanel Control
下表显示了更新面板控件的方法:
Methods |
Description |
CreateContentTemplateContainer |
创建充当子控件容器的控件对象,这些控件定义了 UpdatePanel 控件的内容。 |
CreateControlCollection |
返回 UpdatePanel 控件中包含的所有控件的集合。 |
Initialize |
如果已启用局部页面呈现,则初始化 UpdatePanel 控件触发器集合。 |
Update |
导致 UpdatePanel 控件的内容更新。 |
更新面板的行为取决于 UpdateMode 属性和 ChildrenAsTriggers 属性的值。
UpdateMode |
ChildrenAsTriggers |
Effect |
Always |
False |
Illegal parameters. |
Always |
True |
如果整个页面刷新或其子控件回发,则 UpdatePanel 将刷新。 |
Conditional |
False |
如果整个页面刷新或其外部的触发控件启动刷新,则 UpdatePanel 将刷新。 |
Conditional |
True |
如果整个页面刷新或其子控件回发,或其外部的触发控件启动刷新,则 UpdatePanel 将刷新。 |
The UpdateProgress Control
在更新一个或多个更新面板控件时,UpdateProgress 控件对浏览器提供了一种反馈。例如,当用户登录或在执行某些面向数据库的任务时等待服务器响应时。
它提供“正在加载页面…”之类的视觉确认,指示工作正在进行中。
UpdateProgress 控件的语法如下:
<asp:UpdateProgress ID="UpdateProgress1" runat="server" DynamicLayout="true" AssociatedUpdatePanelID="UpdatePanel1" >
<ProgressTemplate>
Loading...
</ProgressTemplate>
</asp:UpdateProgress>
上述代码段在 ProgressTemplate 标记内显示一条简单消息。但是,它可以是图像或其他相关控件。UpdateProgress 控件在每次异步回发时都会显示,除非使用 AssociatedUpdatePanelID 属性将其分配给单个更新面板。
Properties of the UpdateProgress Control
下表显示了更新进度控件的属性:
Properties |
Description |
AssociatedUpdatePanelID |
获取并设置与此控件关联的更新面板的 ID。 |
Attributes |
获取或设置 UpdateProgress 控件的层叠样式表 (CSS) 属性。 |
DisplayAfter |
获取和设置在显示进度模板后以毫秒为单位的时间。默认值为 500。 |
DynamicLayout |
指示是否动态呈现进度模板。 |
ProgressTemplate |
指在异步回发中显示的模板,该回发的时间超过 DisplayAfter 时间。 |
The Timer Control
计时器控件用于自动启动回发。这可以通过两种方式来完成:
(1) 设置 UpdatePanel 控件的 Triggers 属性:
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnpanel2" EventName="Click" />
</Triggers>
(2) 将计时器控件直接放在 UpdatePanel 内作为子控件触发器。单个计时器可以作为多个 UpdatePanel 的触发器。
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
<ContentTemplate>
<asp:Timer ID="Timer1" runat="server" Interval="1000">
</asp:Timer>
<asp:Label ID="Label1" runat="server" Height="101px" style="width:304px" >
</asp:Label>
</ContentTemplate>
</asp:UpdatePanel>