asp.net AJAX框架人门
所有需要支持ASP.NET AJAX的ASP.NET页面上有且只能有一个ScriptManager控件
ScriptManager控件重要属性如下
一：Scripts
通过path路径注册脚本文件
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Path="Sample.js" />
</Scripts>
</asp:ScriptManager>
Js文件作为资源编译到DLL中
1：建立类库SampleDLL，添加system.web引用
2：创建JScript1.js文件，属性中将生成操作改为“嵌入的资源“
3：添加类文件AssemblyInfo.cs
内容如下
[assembly:System.Web.UI.WebResource("SampleDLL.JScript1.js", "application/x-javascript")],生成程序集后,就可以通过Assembly和Name注册脚本文件
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Scripts>
<asp:ScriptReference Assembly="SampleDLL" Name="SampleDLL.JScript1.js" />
</Scripts>
</asp:ScriptManager>
ScriptManagerProxy控件
存在母板页或者用户控件的时候，如果需要注册不同的脚本文件或服务时使用
注意ScriptManagerProxy位于ScriptManager之后
UpdatePanel控件
把需要更新的部分放到UpdatePanel中，就可以实现页面的局部更新
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:Button ID="Button1" runat="server" Text="不会发生页面回传" OnClick="Button1_Click" />
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="lblTime" runat="server" />
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" /></Triggers></asp:UpdatePanel>
</form>
UpdateProgress控件
一个页面只能有一个这样的控件，它会控制所有的异步请求
功能：显示一个进度条改善用户体验
AjaxControlToolkit工具包
1：假如你将AjaxControlToolkit.dll Copy 到C盘下 在vs2008命令中输入
gacutil –i C:AjaxControlToolkit.dll
2:如果想在页面的CodeBehind中使用Toolkit定义的类型 需要在Web.config 中 配置如下
<system.web>
<compilaton debug=”false”>
<assemblies>
<add assembly="AjaxControlToolkit,Version=3.0.30512.20315,Culture=neutral,PublicKeyToken=28F01B0E84B6D53E"/>
<其他略>
</system.web>
3:让代码看起来更清爽
<system.web>
<pages>
<controls>
<add assembly="AjaxControlToolkit, Version=3.0.30512.20315, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e" namespace="AjaxControlToolkit" tagPrefix="ajaxControlToolkit" />
<!-- 其余略 -->
</controls>
</pages>
<system.web>
二:调用WebService
VS2008默认在web.config中可以看到如下配置
<httpHandlers>
<remove verb="*" path="*.asmx"/>
<add verb="*" path="*.asmx"
validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions,
Version=3.5.0.0,
Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
说明脚本调用Web Service的请求都转给ScriptHandlerFactory处理.
非脚本对Web Service的调用请求转给默认的处理器.
1:首先新建一个web服务WebService1.asmx
若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,加上如下语句
[System.Web.Script.Services.ScriptService]
为此Web服务添加方法
Public string Hello(string name)
{
Return ”Hello:”+name;
}
2:新建页面AjaxAndWebServices.aspx,首先引用Web服务
<asp:ScriptManager ID="ScriptManager1" runat="server">
<Services>
<asp:ServiceReference Path="WebService1.asmx" /></Services></asp:ScriptManager>
输入如下代码
<table>
<tr><td colspan="2">脚本调用Web服务示例(客户端对web服务的请求)</td></tr>
<tr><td>Name:</td><td><input id="name" type="text" /></td></tr>
<tr><td></td><td><input id="send" type="button" value="Send" onclick="Input();" /></td></tr>
<tr><td></td><td><span id="result" /></td></tr>
</table>
在页面头部创建客户端调用此Web服务的脚本
<script type="text/javascript">
//调用web服务的脚本
function Input() {
var name = document.getElementById("name");
WebService1.Hello(name.value, OnSucceeded);
}
//OnSucceeded回调函数
function OnSucceeded(result) {
var results = document.getElementById("result");
results.innerHTML = result;
}
</script>
测试结果:文本框输入abc 能够无刷新正确显示”Hello:abc”
分别通过UpdatePanel模式和WebService模式实现无刷新,可以在Page_Load中设置断点 Page_load代码如下
if (!IsPostBack)
{
//相关代码
}
else //相关代码
发现,点击按钮后,UpdatePanel模式页面每次都会运行else中的语句,而WebService模式不会,WebService模式服务端负担更小