十天学会ASP.Net——(9)

1. AjaxToolKit的介绍和使用

微软Ajax官方网站:

http://www.asp.net/ajax

clip_image002

UED(user experience design)用户体验(User Experience,简称UX 或 UE)是一种纯主观的在用户使用一个产品(服务)的过程中建立起来的心理感受。因为它是纯主观的,就带有一定的不确定因素。个体差异也决定了每个用户的真实体验是无法通过其他途径来完全模拟或再现的。但是对于一个界定明确的用户群体来讲,能够通过设计良好的实验来收集其用户体验的共性。计算机技术和互联网的发展,使技术创新形态正在发生转变,以用户为中心、以人为本越来越得到重视,用户体验也因此被称做创新2.0模式的精髓。

下载ajaxControlToolkit软件包,运行其中的实例网站可以获得丰富的Ajax效果的体验。

clip_image004

clip_image002[5]

clip_image004[5]

clip_image002[7] clip_image004[7] clip_image006

clip_image002[9]

或者将AjaxControlToolkit.dll文件直接拖到工具箱列表中也可以实现Ajax控件的添加。

在页面上放上几个文本框:

clip_image002[11]

选择添加扩展程序。

clip_image004[9]

在弹出的对话框中选择相应想要实现的功能即可:

clip_image002[13]

效果:

clip_image002[15] clip_image004[11]

其它的效果的实现也是类似的

DRY:Don’t repeat yourself,重复利用其他已经实现的效果

jQuery

Ext.JS

Ext.Net

后台服务(Web服务)

一、Web service的概念

想要理解Web service,必须先理解什么是Service(服务)。

传统上,我们把计算机后台程序(Daemon)提供的功能,称为"服务"(service)。比如,让一个杀毒软件在后台运行,它会自动监控系统,那么这种自动监控就是一个"服务"。通俗地说,"服务"就是计算机可以提供的某一种功能。

根据来源的不同,"服务"又可以分成两种:一种是"本地服务"(使用同一台机器提供的服务,不需要网络),另一种是"网络服务"(使用另一台计算机提供的服务,必须通过网络才能完成)。

举例来说,我现在有一批图片,需要把它们的大小缩小一半。那么,我们可以把"缩放图片"看成是一种服务。你可以使用"本地服务",在自己计算机上用软件缩小图片,也可以使用"网络服务",将图片上传到某个网站,让服务器替你缩小图片,完成后再通过网络送回给你。这就好比,一件事你可以自己做,也可以交给另一个人去做。肚子饿了,你可以自己做饭,也可以打电话去订一份比萨,让店家替你做好送上门。

"网络服务"(Web Service)的本质,就是通过网络调用其他网站的资源。

举例来说,去年我写过一个"四川大地震图片墙",它能动态显示关于四川地震的最新图片。但是,所有的图片都不是储存在我的服务器上,而是来自flickr.com。我只是发出一个动态请求,要求flickr.com向我提供图片。这种情况下,flickr.com提供的就是一种Web service。如果我把图片都存放在本地服务器,不调用flickr.com,那么我就是在使用"本地服务"。

所以,Web service让你的网站可以使用其他网站的资源,比如在网页上显示天气、地图、twitter上的最新动态等等。

老师所说的:我想实现一个功能,但别人已经写过了,我就没必要自己再写一遍,可以直接利用别人写过的程序。比如我需要查一个手机号码的归属地,再我的程序上实现这个效果,只需要调用别人已经实现的代码。又比如我需要在我的页面上加入一个显示天气的功能,但是我不可能自己见一个气象站,实际上,很多气象的网站和机构都已经实现了这些功能,可以直接调用。

新建一个Web服务:

clip_image002[17]

项目中多了两个文件:

clip_image004[13]

运行它并点击调用按钮可以看到:

clip_image002[19]

 

关注App_Code》WebService.cs脚本文件

// <summary>
///WebService 的摘要说明
/// </summary>
//这里的名字表示命名空间,说明的你提供的WebService命名空间
//在后面添加Web引用的时候将会用到
[WebService(Namespace = "seg")]
//web服务的微软的标准
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
//若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,请取消对下行的注释。 
//[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService {
    public WebService () {
        //如果使用设计的组件,请取消注释以下行 
        //InitializeComponent(); 
    }
    [WebMethod]
    public string HelloWorld() {
        return "Hello World";
}
//你可以在这里添加一些函数(功能)给其他人使用。
    public int Add(int a, int b)
    {
        return a + b;
    }
}

 

如果我们要用上这个我们自己创建的WebService呢?

添加Web引用:

clip_image002[21]

clip_image004[15]

在弹出窗口(本解决方案中的Web服务)列表中选择刚刚创建的WebService服务。

clip_image002[23]

在引用名栏输入你叫他什么,然后我们一会在页面中这样叫这个Web服务。

这时右边的解决方案管理器发生变化。

clip_image004[17]

添加一个页面文件:

clip_image002[25]clip_image004[19]

using System.Web.UI.WebControls;
protected void Button1_Click(object sender, EventArgs e)
{
	//这里localhost.WebService就是刚刚设置的引用名,相当于一个命名空间。
    localhost.WebService.WebService myservice = new localhost.WebService.WebService();
    Label1.Text = myservice.HelloWorld()+myservice.Add(1+2).ToString();
}

展示效果:

clip_image002[27]

利用互联网上的WebService:

互联网上的Web服务webservice

http://www.webxml.com.cn/zh_cn/index.aspx

clip_image002[29]

点击手机号码归属:

clip_image004[21]

复制URL粘贴到:

clip_image002[31]

VisualStudio会自动替你搜索。然后我们只需要确认下右边的引用名,将其复制下来:

clip_image004[23]

观察解决方案管理器:

clip_image006[8]

后台代码设置:

cn.com.webxml.webservice.MobileCodeWS phoneNumber = new cn.com.webxml.webservice.MobileCodeWS();
Response.Write(phoneNumber.getMobileCodeInfo(TextBox1.Text, ""));

效果:

clip_image008

posted @ 2012-05-25 00:16  Ю詺菛╀時代  阅读(230)  评论(0编辑  收藏  举报