Jquery Ajax调用aspx页面方法

在asp.net webform开发中,用jQuery ajax传值一般有几种玩法

1)普通玩法:通过一般处理程序ashx进行处理;

2)高级玩法:通过aspx.cs中的静态方法+WebMethod进行处理;

3)文艺玩法:通过WCF进行处理。

第一种和第三种方法不在本文介绍范围之内,下面重点介绍第二种方法。

说明

在我们的印象里 asp.net的Web服务是以.asmx来结尾的,而我们现在的asp.net也能实现Web服务,这是因为默认Web.config中已经添加了System.Web.Handlers.ScriptModule,它是用于管理asp.net中ajax功能的HTTP模块,这样不管用户是请求.asmx文件还是.aspx文件,都会通过此处理程序来处理请求。

后台代码:

using System.Web.Services; //引入命名空间

[WebMethod]
public static string SayHello()
{
return "Hello Ajax!";
}

前台页面代码:

<form id="form1" runat="server">
<div>
<asp:Button ID="btn" runat="server" Text="验证用户" />
</div>
</form>

Javascript代码:

$(function() {
$("#btn").click(function() {
$.ajax({
type: "post", //要用post方式
url: "Demo.aspx/SayHello",//方法所在页面和方法名
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
alert(data.d);//返回的数据用data.d获取内容
},
error: function(err) {
alert(err);
}
});
});
});

效果:

需要注意的地方

一、data参数写法

//1)普通写法,JSON键值对,如:单个参数的
data:"{newsID:"+ id +"}",
//多个参数的形式:
data:"{newsID:"+ newsID +",name:"+ name +"}",
//2)文艺写法:各种引号,双引号,单引号拼接,如
//单个参数写法:
data:"{'name':'"+ name +"'}",
//多个参数写法:
data: "{'content':'" + $("#content").val() + "','createTime':'" + $("#createTime").val() + "','creator':'" + $("#creator").val() + "'}"
//容易出错!!!!!

二、用QueryString传值是后台取不到的问题

在WebMethod()方法中,是不能通过 HttpContext.Current.QueryString.Get("id")来获取query string,
因为在WebMethod()默认是用POST方法提交的,而用GetQueryString是不能取到值的。
替代方法是用JS获取url中的参数,用ajax提交给后台方法是用:
< script type = "text/javascript" >
function getArgs(strParame) {
var args = new Object();
var query = location.search.substring(1); // Get query string
var pairs = query.split("&"); // Break at ampersand
for (var i = 0; i < pairs.length; i++) {
var pos = pairs[i].indexOf('='); // Look for "name=value"
if (pos == -1) continue; // If not found, skip
var argname = pairs[i].substring(0, pos); // Extract the name
var value = pairs[i].substring(pos + 1); // Extract the value
value = decodeURIComponent(value); // Decode it, if needed
args[argname] = value; // Store as a property
}
return args[strParame]; // Return the object
} < /script>

三、时间问题

WCF 或 模拟Web服务处理JSON时返回时间格式问题。解决方法如下:

// 杂乱的时间
var rawDate = "/Date(1347120000000+0800)/";
// 提取时间字符串
var strDate = rawDate.substr(6, 13);
// 把时间字符串转化成int类型
var intDate = parseInt(strDate);
// 构造一个Date对象
var newDate = new Date(intDate);
// 将时间转化成当地时间格式
var myDate = newDate.toLocaleDateString();
// 最终结果
alert(myDate); // 合并成一句
var resultDate = new Date(parseInt("/Date(1347120000000+0800)/".substr(6, 13))).toLocaleDateString();

四、$.ajax参数详解

//标准的写法:
$.ajax({
type: "post",
dataType: "json",
contentType: "application/json", //注意:WebMethod()必须加这项,否则客户端数据不会传到服务端
data:{如上所述},//注意:data参数可以是string个int类型
url: "List.aspx/DeleteNews",//模拟web服务,提交到方法
// 可选的 async:false,阻塞的异步就是同步
beforeSend:function(){
// do something.
// 一般是禁用按钮等防止用户重复提交
$("#btnClick").attr({disabled:"disabled"});
// 或者是显示loading图片
},
success: function (data) {
alert("success: " + data.d);//注意这里:必须通过data.d才能获取到服务器返回的值
// 服务端可以直接返回Model,也可以返回序列化之后的字符串,如果需要反序列化:string json = JSON.parse(data.d);
// 有时候需要嵌套调用ajax请求,也是可以的
},
complete: function(){
//do something.
$("#btnClick").removeAttr("disabled");
// 隐藏loading图片
},
error: function (data) {
alert("error: " + data.d);
}
});

Jquery Ajax调用aspx页面方法的更多相关文章

  1. jquery.ajax请求aspx和ashx的异同 Jquery Ajax调用aspx页面方法

    1.jquery.ajax请求aspx 请求aspx的静态方法要注意一下问题: (1)aspx的后台方法必须静态,而且添加webmethod特性 (2)在ajax方法中contentType必须是“a ...

  2. Jquery Ajax调用aspx页面方法 (转载)

    在asp.net webform开发中,用jQuery ajax传值一般有几种玩法 1)普通玩法:通过一般处理程序ashx进行处理: 2)高级玩法:通过aspx.cs中的静态方法+WebMethod进 ...

  3. Jquery Ajax调用aspx页面实例

    目前,我会的几种asp.net界面与后台代码交互方式有几种: 1.webform+服务器控件交互: 2.webform+jquery+ajax+一般处理程序交互: 3.webform+jquery+a ...

  4. asp.net Ajax调用Aspx后台方法

    Ajax调用的前提(以aspx文件为例:) 1.首先需要在aspx文件后台中引用using System.Web.Services; 2.需要调用的方法必须是公共的(public).静态的(stati ...

  5. jQuery中ajax调用当前页面方法

    $.ajax({ type: 'POST', url: 'AddressManager.aspx/GetProvince',//AddressManager.aspx当前页面 data: '{cach ...

  6. JQuery AJAX请求aspx后台方法

    利用JQuery封装好的AJAX来请求aspx的后台方法,还是比较方便的,但是要注意以下几点: 1.首先要在方法的顶部加上[WenMethod]的特性(此特性要引入using System.Web.S ...

  7. Jquery ajax调用后台aspx后台文件方法(不是ashx)

    在asp.net webForm开发中,用Jquery ajax调用aspx页面的方法常用的有两种:下面我来简单介绍一下. (1)通过aspx.cs的静态方法+WebMethod进行处理 简单的介绍下 ...

  8. jQuery ajax调用后台aspx后台文件的两种常见方法(不是ashx)

    在asp.net webForm开发中,用Jquery ajax调用aspx页面的方法常用的有两种:下面我来简单介绍一下. [WebMethod] public static string SayHe ...

  9. .Net中jQuery.ajax()调用asp.net后台方法 总结

    利用JQuery的$.ajax()调用.Net后台方法有多种方式, 不多说了  直接上代码 前台代码 <script type="text/javascript"> $ ...

随机推荐

  1. BZOJ2960: 跨平面

    从一条边出发遍历,每次找旋转角度最小的一条边作为下一条边,直到回到出发的边,就得到了一个区域.这样建出对偶图后跑不定根的最小树形图就行了. #include<bits/stdc++.h> ...

  2. WinForm------GridControl右键添加动态菜单

    转载:http://www.devexpresscn.com/Resources/Documentation-440.html 更加好用的方法: 1.添加一个GridControl控件,PopupMe ...

  3. Spring MVC学习笔记——Controller接口

  4. Java TCP编程

    Java编写TCP编程--回射信息实例 注:简单的tcp联系,还存在问题,readUTF()为阻塞型,如果之前的用户一直不输入,则一直阻塞,之后的用户再连接会出现问题. import java.io. ...

  5. css3 中的transition和transform

    我以前始终都把他搞反,或者是混淆.现在可以稍微小结下. Transition:CSS3中处理动画的一个样式:只涉及动画起始和终止两个状态.如果涉及到一个动画的各个时间或者状态,那就必须要用到的另外一个 ...

  6. ecshop 影响全局的标量lib_main.php

    lib_mian.php 前台公用函数库 1.增加自定义变量  "版权所属"  $copyright    或者  $smarty->assign('get_article_ ...

  7. Mono

    mono (Novell公司开发的跨平台·NET运行环境) http://baike.baidu.com/link?url=iGl5T4-pmpJwB01mQxHq95bJcrCvR_JMNNfP0u ...

  8. EditPlus开发Python的简单设置

    EditPlus是一个功能强大的编辑器,这里介绍用它来开发Python程序所需要的简单设置. 环境:win7 1.设置Python语法缩进: [1]工具-->设置用户自定义工具 [2]在分类面板 ...

  9. CentOS与ubuntu添加eclipse桌面快捷方式的方法整理

    CentOS环境下用右键添加启动器的方式安装(ubuntu早期版本也是这样的) [1]用rmp包安装jdk, 在/usr/local目录下安装:命令 #rpm -ivh   jdk.rpm 然后#vi ...

  10. Java多线程编程核心技术---线程间通信(一)

    线程是操作系统中独立的个体,但这些个体如果不经过特殊处理就不能成为一个整体.线程间的通信就是成为整体的必用方案之一.线程间通信可以使系统之间的交互性更强大,在大大提高CPU利用率的同时还会使程序员对各 ...