Asp.net中ajax调用后台方法

欢迎更多的朋友加入我的QQ群

一起交流学习
ajax调后台的方法。

1、有参数的方法调用

示例代码如下：

前台jQuery代码：

$(function() {

var browers = browersEstimate();

var params = '{browersType:"' + browers + '"}';

$.ajax({

type: "POST", //提交方式

url: "Default.aspx/RecordData", //提交的页面/方法名

data: params, //参数（如果没有参数：null）

dataType: "json", //类型

contentType: "application/json; charset=utf-8",

success: function(data) {

//返回的数据用data.d获取内容

alert(data.d);

},

error: function(err) {

alert(err);

});

});

这个是jquery下Ajax方法调用后台方法。

这个方法有几点需要说明：

type方式必须是post，再有就是后台的方法必须是静态的，方法声明要加上特性[System.Web.Services.WebMethod()]，传递的参数个数也应该和方法的参数相同。

asp.net后台方法：

[System.Web.Services.WebMethod()]

public static void RecordData(string browersType)

{

if (BrowserControl.Counters == null)

{

BrowserControl.InitData(0);

}

if (browersType == "")

{

browersType = "Other";

}

BrowserControl.AddOneByBrowserType(browersType);

if (BrowserControl.WriteInDataBase())

{

BrowserControl.OldTotalCount = BrowserControl.Counters.Count;

}

else

{

BrowserControl.OldTotalCount = 0;

}

}

2、无参数的方法调用

示例代码：

前台jQuery代码

$(function() {

$("#btnOK").click(function() {

$.ajax({

//要用post方式

type: "Post",

//方法所在页面和方法名

url: "data.aspx/SayHello",

contentType: "application/json; charset=utf-8",

dataType: "json",

success: function(data) {

//返回的数据用data.d获取内容

alert(data.d);

},

error: function(err) {

alert(err);

}

});

//禁用按钮的提交

return false;

});

});

asp.net后台方法

[System.Web.Services.WebMethod()]

public static string SayHello()

{

return "Hello Ajax!";

}

3、返回数组方法的调用

示例代码：

asp.net 后台代码：

[System.Web.Services.WebMethod()]

public static List GetArray()

{

List li = new List();

for (int i = 0; i < 10; i++)

li.Add(i + "");

return li;

}

前台JQuery代码：

/**/

$(function() {

$("#btnOK").click(function() {

$.ajax({

type: "Post",

url: "data.aspx/GetArray",

contentType: "application/json; charset=utf-8",

dataType: "json",

success: function(data) {

//插入前先清空ul

$("#list").html("");

//递归获取数据

$(data.d).each(function() {

//插入结果到li里面

$("#list").append("" + this + "");

});

alert(data.d);

},

error: function(err) {

alert(err);

}

});

//禁用按钮的提交

return false;

});

});

4、返回Hashtable方法的调用

using System.Collections;

[System.Web.Services.WebMethod()]

public static Hashtable GetHash(string key,string value)

{

Hashtable hs = new Hashtable();

hs.Add("www", "yahooooooo");

hs.Add(key, value);

return hs;

}

前台JQuery代码：

$(function() {

$("#btnOK").click(function() {

$.ajax({

type: "Post",

url: "data.aspx/GetHash",

//记得加双引号

data: "{ 'key': 'haha', 'value': '哈哈！' }",

contentType: "application/json; charset=utf-8",

dataType: "json",

success: function(data) {

alert("key: haha ==> "+data.d["haha"]+" key: www ==> "+data.d["www"]);

},

error: function(err) {

alert(err + "err");

}

});

//禁用按钮的提交

return false;

});

});

5、操作xml

xnl文件示例：

<?xml version="1.0" encoding="utf-8" ?>

<data>

<item>

<id>1</id>

<name>qwe</name>

</item>

<item>

<id>2</id>

<name>asd</name>

</item>

</data>

Jquery代码：

$(function() {

$("#btnOK").click(function() {

$.ajax({

url: "XMLtest.xml",

dataType: 'xml', //返回的类型为XML ，和前面的Json，不一样了

success: function(xml) {

//清空list

$("#list").html("");

//查找xml元素

$(xml).find("data>item").each(function() {

$("#list").append("id:" + $(this).find("id").text() +"");

$("#list").append("Name:"+ $(this).find("name").text() + "");

})

},

error: function(result, status) { //如果没有上面的捕获出错会执行这里的回调函数

alert(status);

}

});

//禁用按钮的提交

return false;

});

});

6、调后台的另外一种方法：

js代码示例：

function test() {

var browers = browersEstimate();

__doPostBack("CE_RecordData", browers);

}

后台页面代码示例：

protected override void OnLoad(EventArgs e)

{

base.OnLoad(e);

if (this.IsPostBack)

{

if ((Request.Form["__EVENTTARGET"] != null) && (Request.Form["__EVENTTARGET"] != ""))

{

if (Request.Form["__EVENTTARGET"].Substring(0, 3) == "CE_")

{

String strEventArgument = Request.Form["__EVENTARGUMENT"];

Type type = this.GetType();

MethodInfo mi = type.GetMethod(Request.Form["__EVENTTARGET"], BindingFlags.Instance | BindingFlags.NonPublic);

if (mi != null)

{

mi.Invoke(this, new object[] { strEventArgument });

}

}

}

}

}

protected void CE_RecordData(string browersType)

{ -----你需要做的操作----- }

如上代码解释：主要是js代码里面的方法名要与后台一致，方法参数个数也要一致，最重要的是页面的OnLoad事件的重写。在这里面调用的父类的OnLoad事件，重要是利用反射获取要调用的方法，和传递过来的参数。

type.GetMethod(Request.Form["__EVENTTARGET"], BindingFlags.Instance | BindingFlags.NonPublic);这一句里面的参数设置不能变更。必须是实例Instance和不公开的方法。可以看到对应的 CE_RecordData方法是受保护的。