ASP.NET AJAX客户端编程之旅（七）——剩下的问题（完结篇）

======================================================
注：本文源代码点此下载
======================================================

asp.net ajax客户端编程之旅(七)——剩下的问题(完结篇)

2008-09-23 11:18

by

t2噬菌体,

3345

visits,

收藏,

编辑

摘要

通过前面几篇文章,相信大家对asp.net ajax框架的客户端编程已经有了一定了解。并且通过一个完整的控件开发,对这个框架有了整体的了解。这篇文章作为本系列的完结篇,将讨论几个比较琐碎但是与开发息息相关的问题。

关于loading...

相信做ajax应用的朋友没有不使用loading的,不然网络延迟会让用户体验非常差,而且用户会不知道系统正在工作。那么当使用asp.net ajax客户端编程时,怎么做loading呢?

我们先来分析一下loading应该什么时候显示,什么时候终止。一个典型的异步交互过程如下:

1.用户发出请求

2.网络延迟

3.服务器端处理

4.服务器返回数据

5.网络延迟

6.客户端呈现数据

在这个交互过程中,loading应该在第一步后出现,而在第六步结束后才消失。结合前面的知识可以知道,第一步结束的地方是事件处理函数的末尾,而第六步结束的地方是回调函数的末尾。于是,我们找到了loading开始的结束的地方。那么loading怎么实现呢?我的思路是:先在页面上放置一个span或div,里面有loading图片,但是开始时这个span或div是隐藏的。当loading开始时使其可见,而loading结束时使其重新不可见,于是就实现了loading效果。下面我们来看一个例子。

default.aspx:

1@ page language="c#" autoeventwireup="true"codefile="default.aspx.cs" inherits="_default" %>

2

3doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">

4

5html xmlns="http://www.w3.org/1999/xhtml">

6head runat="server">

7title>untitled pagetitle>

8head>

9body>

10form id="form1" runat="server">

11asp:scriptmanager id="scriptmanager1" runat="server">

12scripts>

13asp:scriptreference assembly="microsoft.web.preview" name="previewscript.js" />

14asp:scriptreference path="~/ajax.js" />

15scripts>

16services>

17asp:servicereference path="~/webservice.asmx" />

18services>

19asp:scriptmanager>

20br />

21span id="loading">

22img alt="loading" src="icon/loading.gif" />

23span>

24br />

25span id="content">

26span>

27br />

28input id="submit" type="button" value="获取内容" />

29form>

30body>

31html>

webservice.asmx:

1using system;

2using system.collections;

3using system.linq;

4using system.web;

5using system.web.services;

6using system.web.services.protocols;

7using system.xml.linq;

8using system.web.script.services;

9using system.threading;

10

11/**

12/// summary description for webservice

13///

14[webservice(namespace = "http://tempuri.org/")]

15[webservicebinding(conformsto = wsiprofiles.basicprofile1_1)]

16[scriptservice]

17// to allow this web service to be called from script, using asp.net ajax, uncomment the following line.

18// [system.web.script.services.scriptservice]

19public class webservice : system.web.services.webservice {

20

21public webservice () {

22

23//uncomment the following line if using designed components

24//initializecomponent();

25}

26

27[webmethod]

28public string getcontent() {

29thread.sleep(5000);//延迟5秒返回数据

30return "这是获取的内容";

31}

32

33}

ajax.js:

1var lblloading;

2var lblcontent;

3var btnsubmit;

4

5sys.application.add_init(onpageinit);

6

7function onpageinit()

8{

9lblloading=new sys.preview.ui.label($get("loading"));

10lblloading.initialize();

11lblloading.set_visible(false);//使得一开始loading为隐藏

12lblcontent=new sys.preview.ui.label($get("content"));

13lblcontent.initialize();

14btnsubmit=new sys.preview.ui.button($get("submit"));

15btnsubmit.initialize();

16

17btnsubmit.add_click(btnsubmit_onclick);

18}

19

20function btnsubmit_onclick()

21{

22webservice.getcontent(onsucceeded);

23

24//此处是显示loading的代码,放在事件处理函数的最后

25lblcontent.set_visible(false);

26lblloading.set_visible(true);

27}

28

29function onsucceeded(result)

30{

31lblcontent.set_text(result);

32

33//此处是隐藏loading的代码,放在回调函数的最后

34lblloading.set_visible(false);

35lblcontent.set_visible(true);

36}

相信通过前面的文件,大多数代码已经很少熟悉了,这里只拣关键的说一下。

在webservice中,有一个“thread.sleep(5000);”,这是让返回数据时延时5秒,模拟网络延时,借此更清楚看到loading图标。而在js代码中,btnsubmint_onclick最后的两行代码是显示loading,而onsucceeded最后的两行代码是隐藏loading。

运行这个例子,就可以看到效果。

asp.net ajax还有什么功能

asp.net ajax是一个在茁长成长中的框架,其功能非常丰富,也不断有新功能增加进来。在这短短的几篇文章里,不可能把所有功能都讨论一遍。此系列文章没有涉及到但很有用的功能有很多,如拖放组件可以时我们很轻松的创建具有拖放功能的应用,如购物车、自定义布局等等,数据组件可以使我们在前台实现类似后台的数据绑定等等。

asp.net ajax可以进行底层编程吗

到目前为止,我们所做的程序都是比较“上层”的,都是直接调用了封装好的功能。那么我们有没有可能进行更底层、更细腻的操作呢?答案是肯定的。在这个框架中,有一个sys.net.webrequest组件,利用它,可以从底层进行异步调用,从而进行更细致的操作。至于具体方法请参考相关文档。

asp.net ajax可以用于其他语言或平台吗

对于这个问题,答案是完全可以。其实,asp.net ajax框架本身是纯javascript写成的,和.net平台并无依赖。而服务器端组件只不过是使得使用这些脚本更简单一点。我们使用客户端编程就是直接使用这些脚本。

既然是纯javascript的东西,当然可以应用于一切web开发平台了,只要把相应的脚本文件导入就可以了。所以,你完全可以在j2ee、php或ruby上使用asp.net ajax,甚至可以开发属于这些平台的scriptmanager。

结束语

这个系列的文章到这里就算结束了。短短七篇文章,不可能将整个asp.net ajax框架讲的很透彻,何况这个框架还在不断开发中。只是希望这个系列的文章能起到抛砖引玉的作用,为各位朋友铺平入门的道路。

本文demo在这里下载:loadingdemo.rar

书籍推荐

最后,推荐几本学习asp.net ajax比较好的参考书。

本文基于署名-非商业性使用 3.0许可协议发布,欢迎转载,演绎,但是必须保留本文的署名张洋(包含链接),且不得用于商业目的。如您有任何疑问或者授权方面的协商,请与我联系。

标签: web, ajax, .net, asp.net ajax

绿色通道:好文要顶关注我收藏该文与我联系

categories:

[02]asp.net ajax

tags:

web, ajax, .net, asp.net ajax

add your comment

20 条回复

1889408

#1楼 霍霍 2008-09-23 11:22

真讨厌写js,还不得不写,如果我只想买一本书,楼主推荐哪一本呢?

回复 引用 查看

#2楼 真见 2008-09-23 11:31

晕,,目前为止,你看得ajax书至少是我的4倍了

我只看过陈黎夫的服务端卷

回复 引用 查看

#3楼 mjx[未注册用户]2008-09-23 11:46

ajax 有什么好的,我觉得就是很垃圾的东西,现在很多程序员都论落成做网站的了,还美其名曰“软件工程师”!

回复 引用

#4楼 笨笨狼[未注册用户]2008-09-23 11:48

现在很多的用net的就是在做网站,呵呵。。。。

回复 引用

#5楼 jillean wong 2008-09-23 12:01

--引用--------------------------------------------------

mjx: ajax 有什么好的,我觉得就是很垃圾的东西,现在很多程序员都论落成做网站的了,还美其名曰“软件工程师”!

--------------------------------------------------------

精辟,但是ajax是web发展的必然趋势,无法阻挡。

回复 引用 查看

#6楼 木野狐(neil chen) 2008-09-23 12:10

@mjx

网站只是构建 ui 的一种手段而已。

难道你会认为用 winform 拖控件创建 ui 就会高级很多吗?

这样的观点太表面化了,要知道任何领域都可以做得很深。

回复 引用 查看

#7楼 笨笨狼[未注册用户]2008-09-23 12:34

@木野狐(neil chen)

你说的我也赞同,但是现在很多的所谓的程序员滥用ajax,我也觉得这个东西很垃圾,做垃圾网站的时候可以用下,ajax最烂的的地方就是安全性,可是偏偏很多it民工要把它用在bs上,靠,好像不用就觉得自己跟不上时代了,对这种it民工我真的很鄙视!

回复 引用

#8楼 justin 2008-09-23 12:54

@霍霍

听说 asp.net ajax 编程指南 还不错

回复 引用 查看

#9楼[楼主] t2噬菌体 2008-09-23 13:01

@霍霍

那我推荐《asp.net ajax 实战》

回复 引用 查看

#10楼[楼主] t2噬菌体 2008-09-23 13:02

@mjx

任何新生事物都是在曲折中前进的,不可能一开始就尽善尽美,而且总会遭到批评。但是新事物必将取代旧事物。

回复 引用 查看

#11楼 mjx[未注册用户]2008-09-23 13:09

@t2噬菌体

ajax不是新生事物好吧?他是很久以前的东西了,我叫你一声哥了!

回复 引用

#12楼[楼主] t2噬菌体 2008-09-23 13:14

@mjx

事物的新旧,不是以其出现时间来界定的,而是看其是否具有强大的生命力,是否顺应时代的需求。(ps:这句话摘自马克思的著作,不是我说的。)ajax就是这么一种东西,所以它必定会存在下去。当然,道路是曲折的,但前景是光明的。

不要忘了,当年日心说、进化论、甚至电话刚出现时都曾被认为是没有前途的垃圾。

回复 引用 查看

#13楼 timleaf 2008-09-25 08:31

--引用--------------------------------------------------

笨笨狼: @木野狐(neil chen)

你说的我也赞同,但是现在很多的所谓的程序员滥用ajax,我也觉得这个东西很垃圾,做垃圾网站的时候可以用下,ajax最烂的的地方就是安全性,可是偏偏很多it民工要把它用在bs上,靠,好像不用就觉得自己跟不上时代了,对这种it民工我真的很鄙视!

--------------------------------------------------------

timleaf

回复 引用 查看

#14楼 dynein[未注册用户]2008-12-09 16:56

做网站和做软件有区别?表示层不同而已

回复 引用

#15楼 mjx是sb[未注册用户]2009-03-26 20:53

不用理mjx那样的sb

回复 引用

#16楼 未注册用户[未注册用户]2009-04-12 08:29

@mjx

我不太认可你的观点。。。

其实能够把web开发做好也是件不容易的事情。。 winform 的使用 在某中意义上并没有web那样的方便。

回复 引用

#17楼 asidy 2009-07-26 22:57

看完了,感觉挺不错的,明白了一些以前显模糊的地方,thanks!赞一个!

回复 引用 查看

#18楼 的确小凉 2009-09-13 16:16

强烈支持一下

回复 引用 查看

#19楼 梅桦 2009-10-16 15:05

@mjx

what could you do?

回复 引用 查看

#20楼 新瓶老酒 2010-08-08 13:48

楼上的讨论很激烈,在此,非常感博主的ajax之旅的系统文章,ajax虽然写起来有些烦,但是给用户视觉上很享受。ajax走的道路,虽然曲折,但必定会成为b/s的发展区势。

回复 引用 查看

刷新评论列表刷新页面返回页首

发表评论

昵称: [登录]

[注册]

主页:

邮箱:(仅博主可见)

验证码:看不清。
       换一个

评论内容:

记住我的昵称和主页

-->

登录注册

[使用ctrl+enter键快速提交评论]

0

1296187

zlqbu5m04rs=

首页博问闪存新闻园子招聘知识库

最新it新闻:

·android平台12月广告浏览份额51.6% 超越ios

·测试版ios源代码显示ipad 3或将支持siri

·斯蒂芬·霍金的新电脑

·京东商城2.95亿竞得北京商业地一块

·美报业巨头合作facebook谷歌 传媒重视网络网络

» 更多新闻...

最新知识库文章:

·javascript 面向对象编程

·持续集成之“everything is code”

·持续集成之“软件自我识别”

·持续集成之戏说check-in dance

·什么是闭包。
       我的理解

» 更多知识库文章...

china-pub 2011秋季教材巡展

china-pub 计算机绝版图书按需印刷服务

======================================================
在最后，我邀请大家参加新浪APP，就是新浪免费送大家的一个空间，支持PHP+MySql，免费二级域名，免费域名绑定 这个是我邀请的地址，您通过这个链接注册即为我的好友，并获赠云豆500个，价值5元哦！短网址是http://t.cn/SXOiLh我创建的小站每天访客已经达到2000+了，每天挂广告赚50+元哦，呵呵，饭钱不愁了，\(^o^)/