在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获取内容,如果返回的是C#复杂对象这里返回的就是Json对象,这一点非常Nice
            },
            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提交给后台方法是用:
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
}

三、时间问题

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

// 杂乱的时间
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页面方法

    Jquery Ajax调用aspx页面方法 在asp.net webform开发中,用jQuery ajax传值一般有几种玩法 1)普通玩法:通过一般处理程序ashx进行处理: 2)高级玩法:通过as ...

  2. Jquery Ajax调用aspx页面实例

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

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

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

  4. JQuery AJAX请求aspx后台方法

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

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

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

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

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

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

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

  8. ajax调用WebServices服务方法和传参调用WebServices注意事项

    先演示下ajax是如何调用WebServices中的方法    1.新建一个页面default.aspx,一个Web服务    在页面中引用jQuery文件. <script src=" ...

  9. JQuery ajax调用asp.net的webMethod

    本文章转载:http://www.cnblogs.com/zengxiangzhan/archive/2011/01/16/1936938.html 在vs2010中,用JQuery ajax调用as ...

随机推荐

  1. [LeetCode] Unique Substrings in Wraparound String 封装字符串中的独特子字符串

    Consider the string s to be the infinite wraparound string of "abcdefghijklmnopqrstuvwxyz" ...

  2. [ACM训练] 算法初级 之 搜索算法 之 深度优先算法DFS (POJ 2251+2488+3083+3009+1321)

    对于深度优先算法,第一个直观的想法是只要是要求输出最短情况的详细步骤的题目基本上都要使用深度优先来解决.比较常见的题目类型比如寻路等,可以结合相关的经典算法进行分析. 常用步骤: 第一道题目:Dung ...

  3. Java基础之类Class使用

    大家都知道Java是一门面向对象编程语言,在Java世界里,万事万物皆对象,那个Java中怎么表示对象呢?Class 我们知道Java中的对象都是Object类的子类,那么今天我们就一起来研究一下Ja ...

  4. Sharepoint学习笔记—习题系列--70-573习题解析 -(Q142-Q143)

    Question 142You have a Feature that contains an image named ImageV1.png.You plan to create a new ver ...

  5. SQLMAP大全

    转自:http://blog.csdn.net/zsf1235/article/details/50974194 本人小白,初次认识sqlmap,很多都是转载资料,只是学习研究一下! 练习的网站可以用 ...

  6. Guid和Sequence做主键的比较

    记得A项目组是一个物流管理系统,后台采用了Oracle数据库.在系统中的核心表托运单表中,关于主键采用何种数据类型,是 sequence 还是用GUID , 大家起了争论. 从网络搜索得到的结论看,一 ...

  7. 039医疗项目-模块四:采购单模块—采购单的创建-----------Dao层,service层,Acion层

    我们根据数据库里面的表格:生成对应的Mapper接口文件和...Mapperxml文件: YYCGD:采购单模板表. YYCGD2014:采购单动态生成表,由存储过程生成. YYCGDMX:采购单明细 ...

  8. android中点击空白处隐藏软键盘

    InputMethodManager manager manager = (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERV ...

  9. xml案例(考生成绩管理系统)

    package itacst.dao; import org.w3c.dom.Document; import org.w3c.dom.Element; import org.w3c.dom.Node ...

  10. VIM常用快捷键~网页上查找

    转自~木枫林 转自~鸟哥的私房菜 第十章.vim 程序编辑器 第十章.vim 程序编辑器 最近更新日期:2009/08/20 2. vi 的使用 2.1 简易执行范例 2.2 按键说明 2.3 一个案 ...