Ajax之三 Ajax服务器端控件（上）-阿里云开发者社区

Ajax之三 Ajax服务器端控件（上）

2023-10-10 33

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： Ajax之三 Ajax服务器端控件

视频课：https://edu.csdn.net/course/detail/27107

[学习目标]

理解并掌握ScriptManager控件的使用

了解ScriptManager控件的使用

理解并掌握Timer控件的使用

理解并掌握UpdatePanel控件的使用

理解并掌握UpdateProgress控件的使用

【本章简介】

Ajax Extensions是Asp.NetAJAX框架的核心组件，只有使用它提供的服务，才能实现局部刷新和个性化组件的AJAX效果。

AJAXExtensions是整个Asp.NetAJAX框架的灵魂，它提供全局脚本的管理控制，提供异步获取数据功能，提供页面中某一部分的局部更新，还可以使用定时器实现任务的自动执行。

AJAXExtensions核心组件主要包括以下几个控件：ScriptManager、UpdatePanel、UpdateProgress、Timer和ScriptManagerProxy，下面我们对其中主要的控件逐一进行讲解。

本章的下面几节将介绍这些服务器端控件，以及如何在Asp.Net程序中使用它们。

3.1 ScriptManager控件

在Asp.Net AJAX领域中，最重要的控件是ScriptManager服务器端控件，它处理页面，允许进行部分页面的呈现。每个要使用Asp.Net AJAX功能的页面都需要使用一个ScriptManager控件。它又叫做全局脚本控制器，在每个页面上只能有一个，相当于在这个页面上注册框架。

ScriptManager控件负责管理在页面上使用的JavaScript库，并在服务器和客户机之间来回编组信息，完成部分页面的呈现过程。

如果仅在Asp.Net页面上放置了ScriptManager控件，它就会负责加载Asp.Net AJAX需要的JavaScript库。

注意：

页上使用 ScriptManager 控件注册的任何脚本以及所有事件处理脚本必须位于页上的 form 元素内。否则，将不会注册或执行脚本。

ScriptManager控件的语法格式:

<asp:ScriptManager ID=＂ScriptManager1＂ runat=＂server＂>
</asp:ScriptManager>

3.2 ScriptManagerProxy控件

一个网页只能包含一个 ScriptManager 控件，该控件既可以直接位于页面中，也可以间接位于嵌套组件或父组件内部。使用 ScriptManagerProxy 控件，可在母版页或宿主页已包含 ScriptManager 控件的情况下，将脚本和服务添加到内容页和用户控件中。

在使用 ScriptManagerProxy 控件时，可以将脚本和服务添加到 ScriptManager 控件所定义的脚本和服务集合。如果不希望在包含特定 ScriptManager 控件的每一页上都包含特定的脚本和服务，则可以将这些脚本和服务从 ScriptManager 控件中移除。可以通过改用 ScriptManagerProxy 控件，将这些脚本和服务添加到各页中。

在VisualStudio2005项目中模板页上添加ScriptManager之后，最简单的页面代码如下程序清单3-1所示：

程序清单3-1

<%@Master Language="C#" AutoEventWireup="true"CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>无标题页</title>
</head>
<body>
    <formid="form1" runat="server">
    <div>
           <asp:ScriptManager ID="ScriptManager1"runat="server">
           </asp:ScriptManager>
       <asp:contentplaceholder id="ContentPlaceHolder1"runat="server">
       </asp:contentplaceholder>
    </div>
    </form>
</body>
</html>

在VisualStudio 2008母版也上，有直接添加AJAX Master Page的选项。

如果正在使用Asp.Net2.0的母版页，而且同时还在使用Asp.Net AJAX框架，你可能会考虑把ScriptManager控件放在模板页而不是每个内容页中。然而，当需要在某个内容页上引用JavaScript文件或Web服务时就会遇到麻烦了。由于每个页面上只能有一个ScriptManager控件，因此不得不在每一个使用Asp.Net AJAX的页面上引用JavaScipt文件或服务，哪怕某些页面根本就不需要那些外部资源。

为了解决这个问题，Asp.NetAJAX 提供了ScriptManagerProxy控件。这个控件与ScriptManager的功能一样，当页面上已经有一个ScriptManager控件的时候，就可以使用它了。

<asp:ScriptManagerProxy ID=＂ScriptManagerProxy1＂ runat=＂server＂>
    <Scripts>
        <asp:ScriptReferencePath=＂MyScript.js＂/>
    </Scipts>
</asp:ScriptManagerProxy>

当某个宿主页面上已经有一个ScriptManager控件，而又需要向其添加一个拥有AJAX功能的Asp.Net用户控件时，ScriptManagerProxy控件也同样可以派上用场。

3.2 UpdatePanel控件

UpdatePanel控件又叫做更新面板，它用来实现页面的无刷新效果。在使用时，只需要把更新的内容放在该控件的内容面板中即可。

UpdatePanel控件是一个容器控件，这表示它没有相关的UI项。它是引发部分页面会送的方式，仅更新UpdatePanel指定的部分页面。

UpdatePanel的语法格式：

<asp:UpdatePanel ID=＂UpdatePanel1＂ runat=＂server＂ UpdateMode=＂Always＂>
</asp:UpdatePanel>

n UpdatePanel 控件又一个重要的属性UpdateMode,它表示该更新面板采用何种方式来获取服务器端的资源。它有两种模式：Always和Conditional。

ü Always模式表示，在每次客户端浏览器向服务器端请求的时候，都无条件刷新该更新面板中的内容。

ü Conditional模式表示，有触发条件的更新。该触发条件可能是某一个控件的事件，或者其他可以引起更新的条件等。

n UpdatePanel有两个重要的子元素，分别是和。

ü 元素是更新面板的内容面板，这和GridView等控件的模板类似，可以在其中添加任何控件。

ü 元素是可以更新面板的触发器，只有在触发条件满足后才更新元素中的内容。

项目一：利用UpdatePanel实现局部更新时间

1. 建立一个包含ScriptManager和UpdatePanel的页面，在UpdatePanel上添加一个标签和按钮控件，在外部页面也加一个标签控件,程序代码如程序清单：

程序清单3-2 利用UpdatePanel实现局部更新时间

<%@ Page Language="C#"AutoEventWireup="true" CodeFile="Default.aspx.cs"Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title>Untitled Page</title>
</head>
<body>
    <formid="form1" runat="server">
       <asp:ScriptManager ID="ScriptManager1"runat="server" />
       <div>
           <asp:UpdatePanel ID="UpdatePanel1"runat="server">
                <ContentTemplate>
                    <asp:LabelID="Label1" runat="server"Text="Label"></asp:Label>
                    <asp:ButtonID="Button1" runat="server"OnClick="Button1_Click" Text="Button" />
               </ContentTemplate>
            </asp:UpdatePanel>
           <asp:Label ID="Label2" runat="server" Text="外部时间"></asp:Label></div>
    </form>
</body>
</html>

2. C# 代码为：

    protected voidPage_Load(object sender, EventArgs e)
    {
       Label2.Text = DateTime.Now.ToString();
    }
    protected void Button1_Click(object sender,EventArgs e)
    {
       Label1.Text = DateTime.Now.ToString();
    }

Ajax之三 Ajax服务器端控件（上）

视频课：https://edu.csdn.net/course/detail/27107

热门文章

最新文章

相关课程

相关电子书

相关实验场景