ajax请求后台怎么处理请求,Ajax()方法请求后台数据

Ajax全称为“Asynchronous JavaScript and XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。Ajax技术是目前在浏览器中通过JavaScript脚本可以使用的所有技术的集合。在asp.net中配合updatePanel控件(ajax控件)可以很简单的实现异步无刷新分页。ASP.NET使用ajax实现分页局部刷新页面

对于一些简单的请求,使用ajax控件则非常的臃肿,ajax()方法是jQuery底层的ajax实现,可以通过jQuery的请求加载远程数据。未来ajax将会被jQuery替代。

$.ajax({

type: "GET",

url: "handleAjaxRequest.action",

data: {paramKey:paramValue},

async: true,

dataType:"json",

success: function(returnedData) {

alert(returnedData);

//请求成功后的回调函数

//returnedData--由服务器返回,并根据 dataType 参数进行处理后的数据;

//根据返回的数据进行业务处理

},

error: function(e) {

alert(e);

//请求失败时调用此函数

}

});

}

参数说明:

type:请求方式,“POST”或者“GET”,默认为“GET”。

url:发送请求的地址。

data:要向服务器传递的数据,已key:value的形式书写(id:1)。GET请求会附加到url后面。

async:默认true,为异步请求,设置为false,则为同步请求。

dataType:预期服务器返回的数据类型,可以不指定。有xml、html、text等。

在开发中,使用以上参数已可以满足基本需求。

如果需要向服务器传递中文参数,可将参数写在url后面,用encodeURI编码就可以了。

var chinese = "中文";

var urlTemp = "handleAjaxRequest.action?chinese="+chinese;

var url = encodeURI(urlTemp);//进行编码

$.ajax({

type: "GET",

url: url,//直接写编码后的url

success: function(returnedData) {

alert(returnedData);

//请求成功后的回调函数

//returnedData--由服务器返回,并根据 dataType 参数进行处理后的数据;

//根据返回的数据进行业务处理

},

error: function(e) {

alert(e);

//请求失败时调用此函数

}

});

}

struts2的action对请求进行处理:

public void handleAjaxRequest() {

HttpServletRequest request = ServletActionContext.getRequest();

HttpServletResponse response = ServletActionContext.getResponse();

//设置返回数据为html文本格式

response.setContentType("text/html;charset=utf-");

response.setHeader("pragma", "no-cache");

response.setHeader("cache-control", "no-cache");

PrintWriter out =null;

try {

String chinese = request.getParameter("chinese");

//参数值是中文,需要进行转换

chinese = new String(chinese.getBytes("ISO--"),"utf-");

System.out.println("chinese is : "+chinese);

//业务处理

String resultData = "hello world";

out = response.getWriter();

out.write(resultData);

//如果返回json数据,response.setContentType("application/json;charset=utf-");

//Gson gson = new Gson();

//String result = gson.toJson(resultData);//用Gson将数据转换为json格式

//out.write(result);

out.flush();

}catch(Exception e) {

e.printStackTrace();

}finally {

if(out != null) {

out.close();

}

}

}

struts.xml配置文件:不需要写返回类型

method="handleAjaxRequest">

分享AJAX前后台交互方法

注:ajax通过async参数决定是异步还是同步,false同步,true异步;

异步执行顺序是先执行后续动作,再执行success里代码;

同步是先执行success里代码,再执行后续代码;

验证:同步时数据量大是否会卡顿?例如从后台搜索大量数据时,页面是否卡死?

1、(异步)方法调用,后续代码不需要等待它的执行结果

后台:

using System.Web.Script.Services;

public static string GetStr(string str1, string str2)

{

return str1 + str2;

}

前台:

function Test(strMsg1,strMsg2)

{

$.ajax({

type: "Post",

url: "Demo.aspx/GetStr",

async: true,

//方法传参的写法一定要对,与后台一致,区分大小写,不能为数组等,str1为形参的名字,str2为第二个形参的名字

data: "{'str1':'"+strMsg1+"','str2':'"+strMsg2+"'}",

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

dataType: "json",

success: function(data) {

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

alert(data.d);

},

error: function(err) {

alert(err);

}

});

//隐藏加载动画

$("#pageloading").hide();

}

2、(同步)方法调用,可用于需要得到返回值是执行后续代码的前提

前台:

function Test(strMsg1,strMsg2)

{

var str = “”;

$.ajax({

type: "Post",

url: "Demo.aspx/GetStr",

async: false,

//方法传参的写法一定要对,与后台一致,区分大小写,不能为数组等,str1为形参的名字,str2为第二个形参的名字

data: "{'str1':'"+strMsg1+"','str2':'"+strMsg2+"'}",

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

dataType: "json",

success: function(data) {

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

str = data.d;

},

error: function(err) {

alert(err);

}

});

return str;

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值