日期:2014-05-16 浏览次数:20923 次
在做人事系统添加批量修改的功能中,需要将前台中的数据传给后台,后台并执行一系列的操作。通过查询和学习了解到可以通过ajax将值传入到后台,并在后台对数据进行操作。
说的简单点,就是ajax调用后台的方法。通过学习和实践,学习了几种ajax调用数据的几种形式,现在总结一下:
1. Ajax调用无参的后台方法的数据
Jquery前台代码:
//ajax调用无参数后台方法
$(function () {
$("#btnok").click(function () {
$.ajax({
type:"post", //ajax的方式为post(get方式对传送数据长度有限制)
url: "demo.aspx/Hello", //demo.aspx为目标文件,Hello为目标文件中的方法
contentType: "application/json", //传值方式
success: function (data) { //成功回传值后触发的方法
alert(data.d); //后台返回的参数
}
})
})
});
前台表单控件:
<input id="btnok" type="button" value="单击返回hello" />
后台代码:
//ajax调用的无参数方法
[WebMethod]
public static string Hello()
{
return "Hello Ajax!";
}
运行结果:

2. Ajax调用有参后台方法中的数据
Jquery前台代码:
//ajax调用有参数后台方法
$(function () {
$("#btnName").click(function () {
var strname = $("#txtName").val(); //strname获得文本框中输入的值
$.ajax({
type: "post", //ajax的方式为post(get方式对传送数据长度有限制)
contentType: "application/json", //传值方式
url: "demo.aspx/getName", //demo.aspx为目标文件,getName为目标文件中的方法
data: "{strName:'" + strname + "'}", //strName为后台方法的参数,strname为文本框中输入的值
contentType: "application/json", //传值方式
succes