教学材料ASPNETAJAX.ppt
第1页,第10章 ASP.NET AJAX,本章概述 本章的学习目标主要内容,第2页,本章概述,ASP.NET AJAX采用异步编程方式，最大的特点是提供对客户端脚本的自动管理。利用ASP.NET AJAX服务器控件，程序员可以使用ASP.NET中现有的各种控件实现局部页面更新。本章首先介绍了ASP.NET AJAX的基础只是，然后详细介绍ASP.NET AJAX的主要服务器控件的用法，最后介绍ASP.NET AJAX Control Extenders扩展控件。,第3页,本章的学习目标,掌握ASP.NET AJAX的基本知识；掌握ASP.NET AJAX主要控件的用法；了解ASP.NET AJAX Control Extenders扩展控件。,第4页,主要内容,10.1 ASP.NET AJAX概述10.2 ScriptManager控件10.3 UpdatePanel控件10.4 UpdateProgress控件10.5 Timer控件10.6 ASP.NET AJAX Control Extenders扩展控件10.7 本章小结,第5页,10.1 ASP.NET AJAX概述,Ajax(Asynchronous JavaScript and XML)技术是由Jesse James Garrett提出的，是综合异步通信、JavaScript以及XML等多种网络技术新的编程方式。如果从用户看到的实际效果来看，也可以形象地称之为无页面刷新技术。Ajax技术的主要内容包括：基于Web标准XHTML+CSS的表示；使用 DOM(Document Object Model)进行动态显示及交互；使用 XML 和 XSLT 进行数据交换及相关操作；使用XMLHttpRequest进行异步数据检索；使用JavaScript 将所有的东西绑定在一起等。,第6页,主要内容,10.1 ASP.NET AJAX概述10.2 ScriptManager控件10.3 UpdatePanel控件10.4 UpdateProgress控件10.5 Timer控件10.6 ASP.NET AJAX Control Extenders扩展控件10.7 本章小结,第7页,10.2 ScriptManager控件,ScriptManager控件是ASP.NET AJAX 的核心，它提供处理页面上的所有ASP.NET AJAX控件(UpdatePanel、UpdateProgress等)的支持，没有该控件的存在其他ASP.NET AJAX控件是不能工作的，并且所有需要支持ASP.NET AJAX的ASP.NET页面上只能有一个ScriptManager控件。,第8页,10.2 ScriptManager控件,ScriptManager控件提供了很多属性和方法。,第9页,10.2 ScriptManager控件,将1个ScriptManager控件和1个UpdatePanel控件拖放到页面的【设计】视图中，然后在UpdatePanel中分别放入1个DropDownList和Label控件。双击【设计】视图中的DropDownList控件，添加如下后台代码：protected void DropDownList1_SelectedIndexChanged(object sender,EventArgs e)Label1.Text=DropDownList1.SelectedValue;,第10页,主要内容,10.1 ASP.NET AJAX概述10.2 ScriptManager控件10.3 UpdatePanel控件10.4 UpdateProgress控件10.5 Timer控件10.6 ASP.NET AJAX Control Extenders扩展控件10.7 本章小结,第11页,10.3 UpdatePanel控件,UpdatePanel控件的工作依赖于ScriptManager控件和客户端PageRequestManager类。当ScriptManager允许页面局部更新时，它会以异步的方式回传给服务器，与传统的整页回传方式不同的是，只有包含在UpdatePanel中的页面部分会被更新，在从服务器返回XHTML之后，PageRequestManager会通过操作DOM对象来替换需要更新的代码片段。UpdatePanel工作过程如图所示。,第12页,10.3 UpdatePanel控件,第13页,10.3 UpdatePanel控件,UpdatePanel控件的常用属性如表10-2所示。,第14页,同页面上使用多个UpdatePanel,使用UpdatePanel的时候并没有限制在一个页面上用多少个UpdatePanel，所以可以为不同的需要局部更新的页面区域加上不同的UpdatePanel。由于UpdatePanel默认的UpdateMode是Always，如果页面上有一个局部更新被触发，则所有的UpdatePanel都将更新，有时这是程序员不愿看到的。这时只需要UpdatePanel在它自己的触发器触发的时候更新就可以了，所以需要把UpdateMode设置为Conditional。,第15页,在内容页中使用UpdatePanel,由于网页发送到客户端时，母版页和内容页的内容是合并在一起的，并且网页只能有一个ScriptManager控件，因此只需要在母版页中放置ScriptManager控件，内容页就可以使用UpdatePanel了。,第16页,UpdatePanel异步更新中的错误处理,当发生UpdatePanel控件异步更新错误时，默认情况下会弹出一个错误对话框。如果设计者觉得不符合用户习惯，可以通过ScriptManager控件的OnAsyncPostBackError 事件和AsyncPostBackErrorMessage属性捕捉和设置回传时的错误消息。,第17页,主要内容,10.1 ASP.NET AJAX概述10.2 ScriptManager控件10.3 UpdatePanel控件10.4 UpdateProgress控件10.5 Timer控件10.6 ASP.NET AJAX Control Extenders扩展控件10.7 本章小结,第18页,10.4 UpdateProgress控件,UpdateProgress 控件一般与UpdatePanel 控件联合使用，即在UpdatePanel异步更新过程中，显示提示信息。这些信息可以是一段文字、进度条或各种动画。当异步更新完成时，提示信息自动消失。属性如表所示。,第19页,主要内容,10.1 ASP.NET AJAX概述10.2 ScriptManager控件10.3 UpdatePanel控件10.4 UpdateProgress控件10.5 Timer控件10.6 ASP.NET AJAX Control Extenders扩展控件10.7 本章小结,第20页,10.5 Timer控件,Timer控件是ASP.NET AJAX中又一个重要的服务器控件。通过它可以完成局部页面的定时更新，从而实现局部页面定时刷新、图片自动播放、超时自动退出等功能。其属性如表所示。Interval属性用来决定每隔多长时间要引发回传，其设置值的单位是毫秒，默认值则是60000毫秒，也就是60秒。,第21页,主要内容,10.1 ASP.NET AJAX概述10.2 ScriptManager控件10.3 UpdatePanel控件10.4 UpdateProgress控件10.5 Timer控件10.6 ASP.NET AJAX Control Extenders扩展控件10.7 本章小结,第22页,10.6 ASP.NET AJAX Control Extenders扩展控件,ASP.NET AJAX Control Extenders是一些派生自基类的控件，通常后缀为Extender，扩展控件必须和被其控制的控件组合才能发挥作用。利用扩展控件可以为页面中已存在的控件添加其他功能。它们使得开发者可以封装控件行为，并且使得为应用程序添加更丰富的功能变得非常简单。例如，利用CalendarExtender日期扩展控件，使得TextBox控件录入日期更加方便、直观，而且增加了AJAX功能。,第23页,添加扩展控件到VS工具箱,在VS工具箱中添加扩展控件的步骤如下：(1)从Microsoft公司网站上，下载ASP.NET AJAX Control Toolkit For.NET 4.5工具包。(2)将该工具包解压缩。(3)在VS工具箱中，新建一个名为AJAX Control Toolkit的选项卡。(4)在解压后的工具包中找到AJAXControlToolkit.dll文件，将其拖放到VS工具箱的AJAX Control Toolkit选项卡中。,第24页,绑定扩展控件到某个已存在的控件,扩展控件被添加到VS工具箱后，再选择控件时，会发现一个新的【添加扩展程序】任务选项出现在被选择的控件上，如图所示。如果单击【添加扩展程序】任务选项，将会弹出如图所示的对话框，它包含了所有可以选择的扩展控件，确定后就完成了扩展控件的绑定。,第25页,合并属性窗格,在VS中，当将一个扩展控件绑定到一个控件后，该控件的属性窗格也会扩展显示扩展控件的属性，如图所示。,第26页,删除绑定的扩展控件,如果想删除某个控件的扩展控件，只需要从控件的任务选项中选择“删除扩展程序”选项，如图所示。,第27页,使用FilteredTextBoxExtender控件防止输入非法字符,FilteredTextBoxExtender扩展控件是用来对文本框进行过滤的，让文本框只能对设定的值进行输入。输入类型有Numbers(数字)，LowercaseLetters(小写字母)，UppercaseLetters(大写字母)和Custom(自定义字符串)。,第28页,使用SlideShowExtender控件播放幻灯片,SlideShowExtender扩展控件用于控制Image控件，它可以很方便地实现自动和手动播放图片功能。由于播放图片是在客户端进行的，所以使用SlideShowExtender扩展控件的网页中必须包含ScriptManager控件。,第29页,使用SlideShowExtender控件播放幻灯片,使用AlwaysVisibleControlExtender固定位置显示控件。,第30页,主要内容,10.1 ASP.NET AJAX概述10.2 ScriptManager控件10.3 UpdatePanel控件10.4 UpdateProgress控件10.5 Timer控件10.6 ASP.NET AJAX Control Extenders扩展控件10.7 本章小结,第31页,10.7 本章小结,本章全面讲述了ASP.NET AJAX技术。首先简单介绍了AJAX的概念；然后介绍ScriptManager、UpdatePanel、UpdateProgress、Timer控件在AJAX技术中的使用；最后介绍了ASP.NET AJAX Control Extenders扩展控件的使用。通过本章的学习，读者可以全面的掌握AJAX技术在ASP.NET应用程序中的使用方法。,
