1.spring mvc 接收form表单传递的list对象集合处理
首先是前端页面代码:
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8" />
<title>list对象参数测试</title>
</head>
<body>
<h1>list对象参数测试</h1>
<form action="/sendFormData.do" method="post">
用户1姓名: <input type="text" name="param.users[0].name" />
用户1性别 <input type="text" name="users[0].sex" />
用户1年龄 <input type="number" name="users[0].age" />
<hr />
用户2姓名: <input type="text" name="param.users[1].name" />
用户2性别 <input type="text" name="users[1].sex" />
用户2年龄 <input type="number" name="users[1].age" />
<button type="submit">提交</button>
</form>
<button type="button" id="json-btn">JSON集合对象参数测试</button>
</body>
</html>
注意:这里只用看form表单包裹的内容js部分是后面讲解ajax做的准备 spring mvc 的controller处理方法
@PostMapping("/sendFormData.do")
public Object sendFormData(ParamVO users) {
System.out.println(users.getUsers().size());
return "/test";
}
这里或许你看出来了使用的一个对象去接收form表单提交的数组。这个对象的内容如下
package com.example.vo;
import java.io.Serializable;
import java.util.List;
/**
* 接收数组对象必须使用对象封装一次
* @author xq
*
*/
public class ParamVO implements Serializable {
/**
*
*/
private static final long serialVersionUID = 1L;
private List<UserVO> users;
public List<UserVO> getUsers() {
return users;
}
public void setUsers(List<UserVO> users) {
this.users = users;
}
}
spring mvc里面必须进行封装一次List<UserVO>集合就是我们需要得到的前端数据
2.spring mvc 接收ajax传递list集合对象方法实现
页面:
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8" />
<title>list对象参数测试</title>
</head>
<body>
<h1>list对象参数测试</h1>
<button type="button" id="json-btn">JSON集合对象参数测试</button>
<script type="text/javascript" src="/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$('#json-btn').click(function() {
send1();
});
});
function send1() {
var saveDataAry = [];
var data1 = {
"name" : "test",
"sex" : "男",
"age" : 20
};
var data2 = {
"name" : "ququ",
"sex" : "女",
"age" : 30
};
saveDataAry.push(data1);
saveDataAry.push(data2);
$.ajax({
type : "POST",
url : "/sendData.json",
dataType : "json",//必须json
contentType : "application/json", // 指定这个协议很重要
data : JSON.stringify(saveDataAry),
success : function(res) {
alert("后端返回请求数据为:" + JSON.stringify(res));
}
});
}
</script>
</body>
</html>
注意点是ajax的设置
dataType : "json",//必须json
contentType : "application/json", // 指定这个协议很重要
后端spring mvc 接收方法:
@PostMapping("/sendData.json")
@ResponseBody
public Object sendData(@RequestBody List<UserVO> users) {// @RequestBody该注解很重要
System.out.println(users.size());
for (UserVO userVO : users) {
System.out.println(userVO.toString());
}
return users;
}
https://www.leftso.com/article/284.html