在ASP.NET AJAX Beta2中,UpdateProgress控件已经从“增值”CTP中移到了ASP.NET AJAX核心中。以下两篇关于UpdateProgress的文章基本翻译自ASP.NET AJAX官方网站。
主要内容
1.UpdateProgress控件简单使用
2.使用多个UpdateProgress控件
一.UpdateProgress控件简单使用
1.创建一个Web页面并切换到设计视图。
2.在工具箱的AJAX Extensions标签下,双击ScriptManager控件添加到页面中。
3.双击UpdatePanel控件添加到页面中。

4.双击UpdateProgress控件添加到页面中。
5.在UpdateProgress控件中添加文本“Progress……”。

6.在UpdatePanel中添加一个Button和一个Label。
7.设置Label的Text属性值为“Initial Page Rendered”。

8.双击Button添加Click事件。
9.在Buttond的Click事件处理中添加如下代码,这里人为的创建一个3秒钟的延迟并显示当前时间。
protected void Button1_Click(object sender, EventArgs e)



{
// Introducing delay for demonstration.

System.Threading.Thread.Sleep(3000);

Label1.Text = "Page refreshed at " +

DateTime.Now.ToString();

}
10.保存并按Ctrl + F5运行。
11.单击Button,界面如下:

二.使用多个UpdateProgress控件
默认情况下,UpdageProgress控件将显示页面上所有的UpdatePanel控件更新的进度信息,在以前版本的UpdateProgress中,我们无法设置UpdateProgress只显示某一个UpdatePanel的更新,最新版本的UpdateProgress控件提供了AssociatedUpdatePanelID属性,可以指定UpdateProgress控件显示哪一个UpdatePanel控件。下面的这个例子中UpdateProgrss控件将只显示它所在的UpdatePanel更新信息。
1.创建一个Web页面并切换到设计视图。
2.在工具箱的AJAX Extensions标签下,双击ScriptManager控件添加到页面中。
3.双击UpdatePanel控件两次添加两个UpdatePanel控件到页面中。

4.在每一个UpdatePanel中分别添加一个Label和Button。
5.分别设置两个Label的Text属性值为“Initial Page Rendered”。(官方网站这步有些问题)

6.双击每一个Button控件添加Click事件。
7.在Buttond的Click事件处理中添加如下代码,这里人为的创建一个3秒钟的延迟并显示当前时间。
protected void Button1_Click(object sender, EventArgs e)


{
// Introducing delay for demonstration.

System.Threading.Thread.Sleep(3000);

Label1.Text = "Page refreshed at " +

DateTime.Now.ToString();
}

protected void Button2_Click(object sender, EventArgs e)



{
// Introducing delay for demonstration.

System.Threading.Thread.Sleep(3000);

Label2.Text = "Page refreshed at " +

DateTime.Now.ToString();
}
8.切换到设计视图。
9.在第一个UpdatePanel中添加UpdateProgrss控件,并添加文本Panel1 updating…

10.在第二个UpdatePanel中添加UpdateProgress控件,Panel2 updating…

11.保存并按Ctrl + F5运行
12.单击第一个UpdatePanel中的Button按钮,进度信息只显示在第一个UpdatePanel中。

13.单击第二个UpdatePanel中的Button按钮,进度信息只显示在第二个UpdatePanel中。

posted @ 2006-11-12 15:57
TerryLee 阅读(20981)
评论(87) 编辑 收藏 网摘 所属分类:
[08] Web开发[07] AJAX风云
发表评论
Initial Page Rendered 中的 ‘Rendered’怎么翻译?
#5楼[
楼主]2006-11-12 23:03 |
@james.dong[匿名]
翻译自官方文档
#6楼[
楼主]2006-11-12 23:04 |
@Jacky_xu[匿名]
@King[匿名]
客气:)
#7楼[
楼主]2006-11-12 23:07 |
@Hunts.C
单独一个词拿出来不好翻译,不知道翻译成什么比较好
我在试第一个例子的时候js报错:“'Sys'未定义”,所以也没有出现Ajax的效果
好像装完Beta2版的,查看以前的程序都出问题了,都出现了“'Sys'未定义”的问题
#12楼[
楼主]2006-11-13 18:05 |
救命啊,下面是个自定义控件,放在aspx页里面能显示数据,但ajax不起作用了,整个页面就刷新了。
在vs.net环境里,这个自定义控件出错信息为:呈现控件出错,值不能为空,参数名:child,我就没找到这个参数名啊。
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView id="GridView1" runat="server" AutoGenerateColumns="False" ShowHeader="False" BorderStyle="Solid" GridLines="Horizontal" Width="100%" EmptyDataText="还未添加任何数据">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<img border="0" src='<%=getPic%>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<a class='<%=getNewsCss %>' href='news/<%# DataBinder.Eval(Container.DataItem, "url") %>'
title='<%# DataBinder.Eval(Container.DataItem, "fullTitle") %>' target=_blank><%# DataBinder.Eval(Container.DataItem, "title") %></a>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="ifNew" >
<ItemStyle CssClass='<%=getNewCss %>' />
</asp:BoundField>
<asp:BoundField DataField="addtime" DataFormatString="[{0:yyyy/M/d}]" HtmlEncode="False">
<ItemStyle CssClass='<%=getDateCss %>' />
</asp:BoundField>
</Columns>
</asp:GridView>
<cc1:PaginationBar ID="PaginationBar1" runat="server" OnChangePageIndex="PaginationBar1_ChangePageIndex" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="PaginationBar1" EventName="ChangePageIndex" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" DisplayAfter="100" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<div style="background-color:Yellow; color:Red; font-size:smaller">数据更新中,请稍后......</div>
</ProgressTemplate>
</asp:UpdateProgress>
#14楼[
楼主]2006-11-13 19:26 |
@烈域
你的自定义控件中PaginationBar 都有哪些控件?
@KiddLee
记得看过个说明,b2里ScriptManage用的异步加到js,在js最后加句
if(Sys&&Sys.Application)
{
Sys.Application.notifyScriptLoaded();
}
否则出个Sys.ScriptLoadFailedException。
PS:不确定是否是这样写的,原文找不到了......,希望对你有用
@空空鱼
谢谢你,我再试试,不过现在好像因为装插件装的VS2005的项目模板又没了
为什么我的AJAX Extensions 里没有UpdateProgress谁能告诉我下???
就是个分页控件了,以前用atlas都可以的啊。
换了个版本就不行了。AJAX Extensions
#21楼[
楼主]2006-11-15 12:51 |
@minghui227
下载Beta2里面有
TerryLee, 我装了Beta2,还是没找到UpdateProgress,不知道什么地方没操作对
#23楼[
楼主]2006-11-15 20:06 |
@arthur[匿名]
好像没什么了吧,直接安装就可以了,不需要做什么设置啊
@arthur[匿名]
这个问题我也遇到过,手动添加控件就可以了
上面的例子我run了一下,显示的着么有点不一样,我周围没有边框的也
找到不能解释js中的Sys的问题所在了,在建立项目的时候要建立一个ASP.NET Ajax-Enable Web Site。我原来建立了一个普通的ASP.NET Web Site就出问题了
#27楼[
楼主]2006-11-18 18:05 |
@KiddLee
-_-
新建ASP.NET Web Site也可以,只是需要对Web.config进行配置
TerryLee
我怎么找不到UpdateProgress控件在哪里呢?
找不到的UpdateProgress的兄弟,你添加下面这个dll进工具箱就有了。我刚刚才添加。
C:\Program Files\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025\Microsoft.Web.Extensions.dll
#30楼[
楼主]2006-11-19 21:42 |
@p
一般情况下安装后,ToolBox中就有了
如果没有的话只好自行添加
可是我已经添加了C:\Program Files\Microsoft ASP.NET\ASP.NET 2.0 AJAX Extensions\v1.0.61025\下的所有dll 文件,结果在使用updateprogress时仍然说找不到,很是奇怪,我的工具箱中有这个的阿。
@TerryLee
上面例子中,怎么没设置UpdateProgress控件的AssociatedUpdatePanelID属性呢,呵呵...另外,是不是把UpdateProgress控件放在一个UpdatePanel控件中,就可以直接指定UpdateProgress控件只更新它所在的UpdatePanel控件阿?
我想在打开页面加载数据的时候就使用UpdateProgress,请问如何实现?
把UpdateProgress放到各自的UpdatePanel里
如果不设AssociatedUpdatePanelID,则click后,两个UpdateProgress都出来
如果up1设置的AssociatedUpdatePanelID,而up2没设置
则,点button1则除两个UpdateProgress,点button2,则只出up2自己的
正好反了。
UP1,BTN1,LBL1,UpdateProgress1
UP2,BTN2,LBL2,UpdateProgress2
UP3,BTN3,LBL3,UpdateProgress3
-----------
UpdateProgress2设置AssociatedUpdatePanelID为UP2
其他up设置。
--------
点击BTN1,或者BTN3,结果是相同的,UP1,UP3的UpdateProgress都出现
点击BTN2,三个UpdateProgress都出现。
======================
如果是
UpdateProgress1设置AssociatedUpdatePanelID为UP1
UpdateProgress2设置AssociatedUpdatePanelID为UP2
UpdateProgress3未设置
-------------
点击BTN1,结果是UpdateProgress1和UpdateProgress3出现
点击BTN2,结果是UpdateProgress2和UpdateProgress3出现
点击BTN3,结果是只有UpdateProgress3出现
=========
不知道该怎么解释了,总好是一个都不漏设置了。
@TerryLee
-_-
新建ASP.NET Web Site也可以,只是需要对Web.config进行配置
如何设置啊?
各位大哥:请帮忙啊!
我双击
UpdateProgress控件到页面时,提示
"无法创建控件,因为visual studio 无法在控件程序集中找到该控件的类型."
请问是怎么一回事啊???
#39楼[
楼主]2006-12-13 20:11 |
@lihaojie
下载最新的ASP.NET AJAX Beta2版本安装一下
多谢TerryLee 老大,问题重新安装后已经解决了
#41楼[
楼主]2006-12-15 00:00 |
@lihaojie
:)
#43楼[
楼主]2006-12-24 15:52 |
@丹心猪(Dansinge)
呵呵,坚持哦
我最近卸载了beta2版本,重新安装了rc版本,创建控件的时候也提示"无法创建控件,因为visual studio 无法在控件程序集中找到该控件的类型." 请问该如何解决?
TerryLee 老大,什么时候继续讲这一系列的课程的啊?好期待啊!近来是不是太忙了?没有办法继续讲课了啊?
ScriptManager1
UpdatePanel1
UpdateProgress1
我有个问题 (数据显示用gridview)
页面一加载的时候出现---数据正在加载........---加载完成后显示数据;
也就是只显示这几个字,(不显示gridview控件)
页面上我还有一个button控件,我要重新加载数据,就点button控件,这个时候我要隐藏gridview控件,只显示---数据正在加载....-----这几个字
要如何写代码啊
Email: luowenziliao@yahoo.com.cn
@hm
# re: ASP.NET AJAX入门系列(6):UpdateProgress控件简单介绍 2006-11-16 20:38 hm
上面的例子我run了一下,显示的着么有点不一样,我周围没有边框的也
--------------------------
我也是啊。怎么回事啊。
我安装了ASPAJAXExtSetup.msi,
当从工具栏往页面拖曳时提示"无法创建控件,因为visual studio 无法在控件程序集中找到该控件的类型." 请问该如何解决?
老大,为什么我的多个updatepanel时两个UpdateProgress同时显示了啊
老大,为什么我实验两个updatepanel时两个UpdateProgress同时显示了啊
@netboy
呵呵,我也发现了!可能是LZ忘记嘱咐这里了:
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
//加上AssociatedUpdatePanelID="UpdatePanel1"
<asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2">
//加上AssociatedUpdatePanelID="UpdatePanel2"
不知道TerryLee页面中UpdaePanel周围的圆角边框是怎么做出来的。我照着文中的步骤作,并没有边框阿
请欣赏:
www.nfyxtime.com
www.szarts.com
www.civisi.com
www.chinalhcz.com
www.sz4a.cn
www.chinauci.cn
sys报错或是AJAX无效的朋友们,是不是没有通过模板
Ajax_Enabled WebSite来建立网站?
我们学校机房也出现过这种情况,安装完成Ajax Extensions 之后,没有出现Ajax Enabled WebSite,但工具箱中出现Ajax Extensions,重新定主模板目录,再用模板建立网站,运行无错。。。。。。
本人也是学习中,呵呵。。。。。。
--引用--------------------------------------------------
KiddLee: 我在试第一个例子的时候js报错:“'Sys'未定义”,所以也没有出现Ajax的效果
--------------------------------------------------------
我以前也是这样。但是我重装后。重启IIS后就没了。。
李大哥,你好,我看到这里就做不下去了,因为我的控件上没有这个控件“UpdateProgress”,还要装什么东西吗?请指教。
发现点小问题,就是最后的例子,大家把两个Button都移到UpdatePanel之外,并分别给UpdatePanel设置Trigger指向两个Button,记得给两个UpdateProgress指定AssociatedUpdatePanelID到对应的UpdatePanel。这时运行网站,发现点击每个Button的时候,对应的UpdatePanel会Update,但是对应的UpdateProgress并不会显示。大家有没有试过啊?怎么回事啊?有知道的说一声啊!谢谢了!
AssociatedUpdatePanelID忘记设计了吧?
#69楼[
楼主]2008-12-25 15:07 |
@啊啊啊
在Beta 1时,不用设置AssociatedUpdatePanelID也可以的。
@testtest
在updatepanel上面加fieldset
#72楼[
楼主]2009-01-12 11:28 |
@yath
当然可以了
TerryLee 老大,如果我在要多层架构下使用ajax,该如何做呢?比如:我们现在项目快结束了,但客户突然提出来要使用ajax,完善页面。这个时候,我该如何配才能在这个项目中使用ajax呢?急
怎样在页面加载的时候,updateprogress就发挥作用,你还没有说呢
很不错啊
刚到一小公司,只知道套着用
现在明白多了
感谢啊