ASPNET AJAX入门系列：使用客户端脚本对UpdateProgress编程_第1页
ASPNET AJAX入门系列：使用客户端脚本对UpdateProgress编程_第2页
ASPNET AJAX入门系列：使用客户端脚本对UpdateProgress编程_第3页
ASPNET AJAX入门系列：使用客户端脚本对UpdateProgress编程_第4页
ASPNET AJAX入门系列：使用客户端脚本对UpdateProgress编程_第5页
已阅读5页，还剩4页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

1、ASP.NET AJAX入门系列 ：使用客户端脚本对UpdateProgress编程 在本篇文章中，我们将通过编写JavaScript来使用客户端行为扩展UpdateProgress控件，客户端代码将使用ASP.NET AJAX Library中的PageRequestManager，在UpdateProgress控件中，将添加一个Button，来允许用户取消异步更新，并且使用客户端脚本来显示或者隐藏进度信息。 主要内容1通过客户端脚本取消异步更新2通过客户端脚本显示或者隐藏进度信息 一通过客户端脚本取消异步更新1创建一个Web页面并切换到设计视图。2在工具箱中双击Scri

2、ptManager、UpdatePanel、UpdateProgress控件添加到页面中。添加后页面如下：3在UpdatePanel控件中添加一个Label控件并设置它的Text属性值为“Panel Rendered”。4添加一个Button控件并设置它的Text属性值为“refresh”。5在UpdateProgress控件中添加文本text Processing，并添加一个HtmlButton控件并设置它的Text属性为cancle。6双击refresh控件添加Click事件。7在Buttond的Click事件处理中添加如下代码，人为的创建一个3秒钟的延迟并显示当前服务器的时间。prote

3、cted void Button1_Click(object sender, EventArgs e)    System.Threading.Thread.Sleep(3000);    Label1.Text = DateTime.Now.ToString();8添加如下脚本，获取一个当前PageRequestManager类的实例，并创建一个函数调用abortPostBack方法来停止异步更新。<script languag

4、e="javascript" type="text/javascript"><!- var prm = Sys.WebForms.PageRequestManager.getInstance();function CancelAsyncPostBack()     if (prm.get_isInAsyncPostBack()       prm.abor

5、tPostBack();    / -></script>9设置HtmlButton的click特性为CancelAsyncPostBack。10添加如下的样式块到<head>元素之间。<style type="text/css">#UpdatePanel1   width:200px; height:100px;  border: 1px solid gray;#UpdateProg

6、ress1   width:200px; background-color: #FFC080;  bottom: 0%; left: 0px; position: absolute;</style>11保存并按Ctrl + F5运行。12单击refresh按钮，经过短暂的延时之后显示进度信息，完成异步更新之后UpdatePanel中的信息显示为当前的服务器时间。13单击refresh按钮并立即单击Cancle按钮结束异步更新，注意到UpdatePanel中的时间信

7、息并没有更新。二通过客户端脚本显示或者隐藏进度信息在下列情况下，UpdateProgress控件将不会自动显示：由UpdateProgress控件关联的UpdatePanel之外的控件引发的异步更新。UpdateProgress控件没有关联任何UpdatePanel，不在UpdatePanel中的控件引发的异步更新（例如用代码实现的更新）。下面的例子将展示一个不在UpdateProgress所关联的UpdatePanel中的控件所引发的异步更新时，如何显示UpdateProgress控件。1在我们前面所创建的页面中，切换到设计视图。2选中UpdateProgress控件，在属性窗口中，设置As

8、sociatedUpdatePanelID属性为UpdatePanel1。3在UpdatePanel和UpdateProgress控件之外添加一个Button控件。4设置Button的Text属性值为Trigger，并设置ID属性为Panel1Trigger。5选择UpdatePanel控件，在属性窗口中Triggers属性行单击ellipsis ()。6创建一个异步更新触发器，并设置控件ID为Panel1Trigger。7双击Trigger按钮添加Click事件。8在Buttond的Click事件处理中添加如下代码，人为的创建一个3秒钟的延迟并显示当前服务器的时间，并附加上一条信息表示是由触

9、发器引发的异步更新。protected void Panel1Trigger_Click(object sender, EventArgs e)    System.Threading.Thread.Sleep(3000);    Label1.Text = DateTime.Now.ToString() + " - trigger"9在代码窗口，在已有的<Script>脚本

10、块中添加如下代码：<script language="javascript" type="text/javascript"><!- var prm = Sys.WebForms.PageRequestManager.getInstance();function CancelAsyncPostBack()     if (prm.get_isInAsyncPostBack()   

11、    prm.abortPostBack();    prm.add_initializeRequest(InitializeRequest);prm.add_endRequest(EndRequest);var postBackElement;function InitializeRequest(sender, args)     if (prm.get_isInAsyncPostBack()  

12、60;      args.set_cancel(true);        postBackElement = args.get_postBackElement();    if (postBackElement.id = 'Panel1Trigger')        

13、 $get('UpdateProgress1').style.display = 'block'                    function EndRequest(sender, args)     if (postBackElement.id = 'Panel1Trigger') &

人人文库> 全部分类> 行业资料 > 管理策划

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论