轻松掌握Ajax.net系列教程一：部署AJAX.NET

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

本系列文章其实算不上教程,只能算是在下的学习笔记。所有内容均取自asp.net开发队的joe stagner所做的"how do i?"系列视频教程。在下面的讲解里我会列出所对应的视频教程,有能力的朋友可以自行观看,如果觉得听不懂老外说啥,也可以来参考一下我的学习笔记。

本系列文章主要介绍ajax.net的使用方式,重点介绍ajax.net的工具包ajax-toolkit中各种控件的使用方法。

这里就不再重复什么是ajax.net以及它的光辉历史了,我们直接开始。

第一步:安装ajax.net。

安装ajax.net很简单,但安装ajax.net扩展包之前我们必须确保我们已经正确安装了vs.net 2005或visual web developer 2005 express edition和.net frameworks 2.0。

我们可以登录ajax.net官方网站下载ajax.net扩展包。地址:http://ajax.asp.net/downloads/default.aspx?tabid=47

下载完之后双击安装,安装后大家可以看一下更新文档,看看ajax.net究竟更新了什么功能。

第二步:建立ajax-enabled网站

打开vs.net2005,选择新建网站,如果你已成功安装ajax.net扩展包,你会发现在项目模板里会多了一项:asp.net ajax-enabled web site。选择它然后新建一个网站。

建立网站后你会发觉ajax-enabled网站会比一般网站多出了一个scriptmanager控件。scriptmanager是ajax.net一个很重要的控件,它在一个页面内只能出现一次(如果使用了masterpage,那么masterpage使用了scriptmanger后,子页面就不能再使用了),负责处理当前页面所有ajax.net组件和局部更新。它也可以指定我们所需的脚本库,提供更灵活的操作,更详细的介绍请查看msdn相关描述。

第三步:构建简单的ajax.net程序

我们可以先随便拖两个label控件和一个button控件进入设计窗口,然后编写常规的asp.net程序,例如输出日期到两个label控件上。

运行后我们能看到预期的效果,每次点击button,页面都会刷新,两个label上的时间都会发生改变。那么我们怎么利用ajax.net使到功能一样,但页面却不会刷新呢。我们需要使用updatepanel控件来完成。

从工具栏里拖出updatepanel控件,然后把其中一个label控件和button控件拖进updatepanel范围里面,如图所示,然后运行。

我们可以发现,当我们再次点击button的时候,在updatepanel里的label控件依然会改变显示时间,而且页面也不再刷新了,但updatepanel外的label控件则没有发生变化。这就是ajax.net局部刷新现象,在updatepanel范围里的控件会根据逻辑进行相应的改变而不需通过重新请求页面。而updatepanel以外的控件虽然根据逻辑会改变值,但由于页面没有重新请求,它们的改变反映不出来,因此就没有任何变化了。

我们也可以把button拉出updatepanel而达到同样的效果,但我们需要定义updatepanel的触发条件。我们切换到html模式,填写触发代码,如下图所示:

运行,效果与刚才一样。

结束:

本节主要介绍了怎样安装ajax.net扩展包以及如何建立一个简单的ajax.net网站,大家可以通过以上例子举一反三,做出很多简单的ajax特效。

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