使用 jQuery 调用 ASP.NET AJAX Page Method

时间:2022-01-12 16:44:21

文章来源:http://chungle.iteye.com/blog/406054

说到轻量级的客户端通信,我注意到大多数人喜欢使用 ASP.NET AJAX Page
Method 多于 ASMX Web 服务。事实上,在我的文章《使用 jQuery 调用 ASMX Web 服务》的第一条评论中就提到了
Page Method。

鉴于它们流行度,我觉得我应该注意到这个需求。作为对评论中 Justin 问题的回答,我找到了使用 jQuery 调用 Page Method 的方法。事实上,你可以完全不使用 ScriptManager 来达到这个目的。

在这篇文章中,我将说明什么在使用 Page Method 时什么是必要的以及什么是不必要的。然后我将展示在不使用 ScriptManager 时通过 jQuery 来调用 Page Method。

创建一个用于测试上的的页面

写一个 Page Method 是很简单的。 Page Method 必须声明为静态方法,并且它们必须使用[WebMethod] 特性标注。除此之外,AJAX.NET AJAX 处理了其余在服务器需要做的工作。

下面是我们用于示例的 Page Method:

public partial class _Default : Page
{
[WebMethod]
public static string GetDate()
{
return DateTime.Now.ToString();
}
}

那 ScriptManager 和 EnablePageMethods 呢?

传统方法中,要使用 Page Method 的第一步就是设置 ScriptManager 的 EnablePageMethods 属性为 true。

幸运的是,这个属性名有一定程度上的用词不当。它并不会使 Page Method 可用,而仅仅是简单为页面代码中合适的方法生成了内嵌的 JavaScript 代理。

例如,如果在上面的示例对应的页面 Default.aspx 添加了一个 ScriptManager 并且设置了它的 EnablePageMethods 属性为 true,下面的 JavaScript 代码就会嵌入到页面中:

var PageMethods = function() {
PageMethods.initializeBase(this);
this._timeout = 0;
this._userContext = null;
this._succeeded = null;
this._failed = null;
} PageMethods.prototype = {
_get_path:function() {
var p = this.get_path();
if (p) return p;
else return PageMethods._staticInstance.get_path();},
GetDate:function(succeededCallback, failedCallback, userContext) {
return this._invoke(this._get_path(), 'GetDate',false,{},
succeededCallback,failedCallback,userContext); }}
PageMethods.registerClass('PageMethods',Sys.Net.WebServiceProxy);
PageMethods._staticInstance = new PageMethods(); // Generic initialization code omitted for brevity. PageMethods.set_path("/jQuery-Page-Method/Default.aspx");
PageMethods.GetDate = function(onSuccess,onFailed,userContext) {
PageMethods._staticInstance.GetDate(onSuccess,onFailed,userContext);
}

如果你不懂这段代码也没有关系,你不需要知道它是怎么工作的。你只需要知道这个 JavaScript 代理可以让你使用 PageMethods.MethodName 这样的语法来调用 Page Method。

这点重要的一点就是 PageMethods 代理对象归根结底就是一个规则 ASP.NET 服务调用的封装。

使用 jQuery 调用 Page Method

要知道调用 Page Method 与调用一个 Web 服务是一样的,使用 jQuery 调用 Page Method 并不难。要了解更详细的信息,可以参考我之前的文章《让
jQuery 使用 ASP.NET AJAX 的 JSON 序列化的 Web 服务》
 。

使用 jQuery 调用 Page Method,下面就是你所有需要做的:

$.ajax({
type: "POST",
url: "PageName.aspx/MethodName",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
// Do something interesting here.
}
});

综合示例

对应上面示例 Page Method 对应的 Default.aspx 如下:

<html>
<head>
<title>Calling a page method with jQuery</title>
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="Default.js"></script>
</head>
<body>
<div id="Result">Click here for the time.</div>
</body>
</html>

正如你所看到的,这里没有 ScriptManager,更没有 EnablePageMethods。

下面是 Default.aspx 所引用的 Default.js:

$(document).ready(function() {
// 添加 Page Method 调用的函数作为 div 的 onclick 事件
  $("#Result").click(function() {
$.ajax({
type: "POST",
url: "Default.aspx/GetDate",
data: "{}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
// 使用 Page Method 的返回值来替代 div 的内容
$("#Result").text(msg.d);
}
});
});
});

最后的结果就是当我们的 div 被点击之后,jQuery 发送一个 AJAX 请求到
GetDate Page Method 然后使用返回值替换 div 的内容。

结语

Page Method 比一开始看起来更易于使用。EnablePageMethods 的相对不重要是一个惊喜。

为了避免使演示这个机制复杂,示例仅演示了最简单的目的。如果你想看一下实际运用的例子,可以看看 Moses 使用这个技术
GridView 中实现记录详情展开
的功能。

如果你已经准备要将 ScriptManager 用于其他目的,使用 JavaScript 代理调用 Page Method 也没有坏处。无论如何,如果不准备使用 ScriptManager 或才已经在你的页面中包含了 jQuery,我想这是更高效使用 jQuery 的方法。

随机推荐

  1. ZOJ Problem Set - 1337 Pi 最大公约数

    这道题目的关键在于怎么求两个整数的最大公约数,这里正好复习一下以前的知识,如下: 1.设整数a和b 2.如果a和b都为0,则二者的最大公约数不存在 3.如果a或b等于0,则二者的最大公约数为非0的一个 ...

  2. React-Native性能优化点

    shouldComponentUpdate 确保组件在渲染之后不需要再更新的,即静态组件,尽量在其中增加shouldComponentUpdate方法,防止二次消耗所产生的性能消耗 shouldCom ...

  3. 用css3制作旋转加载动画的几种方法

    以WebKit为核心的浏览器,例如Safari和Chrome,对html5有着很好的支持,在移动平台中这两个浏览器对应的就是IOS和Android.最近在开发一个移动平台的web app,那么就有机会 ...

  4. mysql隔离级别的设置和检索

    001.设置方式: 001.在/etc/my.cnf配置文件中设置,这个格式一定要记清楚呀! transaction-isolation=READ-COMMITTED 这里要写在“-”号不是“_&qu ...

  5. 谈谈php依赖注入和控制反转

    要想理解php依赖注入和控制反转两个概念,就必须搞清楚如下的问题: DI--Dependency Injection   依赖注入 IoC--Inversion of Control  控制反转 1. ...

  6. BZOJ--1045-- 糖果传递(中位数,排序)

    题目链接 :BZOJ--1045-- 糖果传递 我们知道如果不头尾相连的话 直接求一个前缀和 答案为ans+=s[i] 不相连的话就是1 和n之间断开 头尾相连的话就是 在第k个人之间断开 设A[i] ...

  7. SSM框架-SpringMVC 实例文件上传下载

    一.新建一个Web工程,导入相关的包 springmvc的包+commons-fileupload.jar+connom-io.jar+commons-logging,jar+jstl.jar+sta ...

  8. Java Iterator的一般用法

    Iterator(迭代器) 迭代器是一种设计模式,它是一个对象,它可以遍历并选择序列中的对象,而开发人员不需要了解该序列的底层结构.迭代器通常被称为“轻量级”对象,因为创建它的代价小. Java中的I ...

  9. pt1000测温度

    本设计使用的PT1000热电阻铂热电阻,它的阻值会随着温度的变化而改变.PT后的1000即表示它在0℃时阻值为1000欧姆,在300℃时它的阻值约为2120.515欧姆.它的工业原理:当PT1000在 ...

  10. day5-基础 函数

     函数 函数一词来源于数学,但编程中的「函数」概念,与数学中的函数是有很大不同的,具体区别,我们后面会讲,编程中的函数在英文中也有很多不同的叫法.在BASIC中叫做subroutine(子过程或子程序 ...