日期:2014-05-16 浏览次数:20836 次
在做人事系统添加批量修改的功能中,需要将前台中的数据传给后台,后台并执行一系列的操作。通过查询和学习了解到可以通过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