jquery ajax 向后台传递数组参数示例

所属分类: 网络编程 / AJAX相关 阅读数: 1090
收藏 0 赞 0 分享

需求:
在JS中向后台传递数组参数

分析:
JS中的数组是弱类型的可以放任何类型(对象、基本类型),但是如果数组中放的是对象类型,传递到后台是显示的只能是对象字符串--[object Object],原因如下:
在后台接收的时候,只能用request来接收,request.getParameterValues()方法返回的是一个String[],所以,应该是在前台传输的时候调用了对象的toString()方法,那么如果依然想传递对象怎么办?凉拌!
但是可以使用JSON字符串来实现,在后台把JSON字符串解析成JAVA对象。

也许,你要说如果是复合对象怎么办,比如如下:

复制代码 代码如下:

public class Person {
private String username;
private String password;
private Address addr;
}

Person对象里有个Address类型的addr属性,没关系,任何对象最终用到的属性值都是基本数据类型,只需要使用对应的包装类型parseInt、或者parseXXX解析即可。

实现:
OK,原理就是这么个。先看JS如何写:
复制代码 代码如下:

var as = [];
var temp = [];
for ( var int = 0; int < 5; int++) {
temp.push('{"k":');
temp.push(int);
temp.push(',"v":');
temp.push(int);
temp.push('}');
as.push(temp.join(""));
}
//Jquery中的方法,具体参考Jquery API
$.post(
"servlet/AjaxServlet?m=putWarningRule",{"aa":as}
);


最终拼成的串就是如下样式,(只作举例)
复制代码 代码如下:

{"k":0,"v":0}

后台接收,不讨论任何框架,只需要HttpServletRequest即可
复制代码 代码如下:

String[] jsonArr = request.getParameterValues("aa[]");

有一点需要注意,在js中传参的时候参数名叫"aa",而在后台接收的时候却是"aa[]",这里应该是Jquery做了转换,所以最好的方式就是在JS中就改为"aa[]",之所以这里没有写"[]"是为了说明问题。可以使用如下方式打印request中的所有参数
复制代码 代码如下:

Enumeration<String> names = request.getParameterNames();
while (names.hasMoreElements()) {
String string = (String) names.nextElement();
System.out.println(string);
}

OK,至此为止,已经接收完毕,剩下的就是如何将一个JSON字符串转成一个POJO了。我使用jsontools-core-1.7.jar,此jar包依赖antlr-2.7.7.jar,自行到代码库中下载,下载完毕,导入classpath,写一个简单的工具类,主要有这么2个方法:
复制代码 代码如下:

/**
* 将对象转换为JSON格式的字符串
* @param obj
* @return 返回JSON字符串
*/
public static String toJSONAsString(Object obj){
try {
return JSONMapper.toJSON(obj).render(false);
} catch (MapperException e) {
e.printStackTrace();
}
return null;
}

@SuppressWarnings("unchecked")
public static <T> T jsonToObject(String jsonStr, Class<T> targetClass) throws TokenStreamException, RecognitionException, MapperException{
JSONValue jv = new JSONParser(new StringReader(jsonStr)).nextValue();
return (T) JSONMapper.toJava(jv,targetClass);
}

//test
public static void main(String[] args) throws Exception {
Person p = new Person();
p.setK("a");
p.setV("v");

String json = toJSONAsString(p);
Person np = jsonToObject(json,Person.class);
System.out.println(np.getK()+"=="+np.getV());
}

request取到值后,遍历数组,挨个转换
复制代码 代码如下:

Person p = JSONUtils.jsonToObject(jsonArr[0], Person.class);

Person类如下:
复制代码 代码如下:

public class Person {
private String k;
private String v;
public String getK() {
return k;
}
public void setK(String k) {
this.k = k;
}
public String getV() {
return v;
}
public void setV(String v) {
this.v = v;
}
}

更多精彩内容其他人还在看

理解jquery ajax中的datatype属性选项值

jquery中ajax的dataType属性用于指定服务器返回的数据类型,如果不指定,jQuery 将自动根据HTTP包MIME信息来智能判断,如果datatype选项不填写的话,会将返回的数据当成字符串处理。
收藏 0 赞 0 分享

基于Jquery ajax技术实现间隔N秒向某页面传值

这篇文章给大家介绍jquery ajax技术实现每隔一段时间向某页面传值,以及setinterval()方法的语法介绍,对本文感兴趣的朋友可以参考下
收藏 0 赞 0 分享

通过Ajax两种方式讲解Struts2接收数组表单的方法

使用struts2表单传值,可以传一个或者是作为一个对象的各个属性传,都非常灵活便捷。但是如果我们需要传一个数组并希望struts正确接收,该怎么处理呢?接下来,通过本文给大家介绍通过Ajax两种方式讲解Struts2接收数组表单的方法,需要的朋友可以参考下
收藏 0 赞 0 分享

基于Jquery.history解决ajax的前进后退问题

本文主要给大家介绍基于Jquery.history解决ajax的前进后退问题,涉及到jquery前进后退相关方面的知识,本文内容经典,非常具有参考价值,特此把jquery前进后退相关知识分享在脚本之家网站供大家参考
收藏 0 赞 0 分享

使用HTML5中postMessage知识点解决Ajax中POST跨域问题

这篇文章主要介绍了使用HTML5中postMessage知识点解决Ajax中POST跨域问题的相关资料,需要的朋友可以参考下
收藏 0 赞 0 分享

谈谈你对aja的理解(一、二)

Ajax是Asynchronous Javascript And XML的缩写,其作用通过Ajax可以使用Javascript语句来调用XMLHttpRequest对象,直接与服务器进行通讯,可以在不重载页面的情况下与服务器交换数据。
收藏 0 赞 0 分享

关于ajax对象一些常用属性、事件和方法大小写比较常见的问题总结

最近比较空闲,于是抽个时间整理些关于ajax方法的东东。在项目中经常发现ajax板块好多问题都是属性,方法,事件大小写不区分问题,最终导致了程序运行出现麻烦,下面给大家介绍关于ajax对象一些常用属性、事件和方法大小写比较常见的问题总结
收藏 0 赞 0 分享

Ajax请求session失效该如何解决

HTML + Servlet + Filter + jQuery 一般来说我们的项目都有登录过滤器,一般请求足以搞定。但是AJAX却是例外的,所以解决方法是设置响应为session失效。
收藏 0 赞 0 分享

编写轻量ajax组件02--浅析AjaxPro

ajaxpro虽然是一个比较老的组件,不过实现思想和源码还是很有借鉴价值的。接下来通过本篇文章给大家介绍编写轻量ajax组件02--浅析AjaxPro,感兴趣的朋友可以参考下
收藏 0 赞 0 分享

编写轻量ajax组件01-与webform平台上的各种实现方式比较

这篇文章主要介绍了编写轻量ajax组件01-与webform平台上的各种实现方式比较,需要的朋友可以参考下
收藏 0 赞 0 分享
查看更多