SpringMVC将表单对象序列化成Json字符串提交，以List接收
出自：http://blog.csdn.net/m0_37595732/article/details/71440853
HTML
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" isELIgnored="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>submitUserList_4</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<script language="JavaScript" src="${ctx }/js/jquery-3.1.1.min.js" ></script>
<script language="JavaScript" src="${ctx }/js/parseJson.js" ></script>
<script type="text/javascript" language="JavaScript">
//将表单序列化成json格式的数据(但不适用于含有控件的表单，例如复选框、多选的select) function submitUserList_4() {alert("ok");
var jsonStr = $("#form1").
serializeJson();
//console.log("jsonStr:\r\n" + jsonStr);
//alert(jsonStr);
$.ajax({
url : "${ctx}/test/getJsList",
type : "POST",
contentType : 'application/json;charset=utf-8', //设置请求头信息
dataType : "json",
data : jsonStr,
success : function(data) {
alert(data);
},
error : function(res) {
alert(res.responseText);
}
});
}
</script>
</head> <body>
<h1>submitUserList_4</h1>
<form id="form1">
age:<input type="text" name="age" value="11"><br/>
name:<input type="text" name="name" value="jack"><br/>
sex:<input type="text" name="sex" value="男"><br/><br/> age:<input type="text" name="age" value="12"><br/>
name:<input type="text" name="name" value="rose"><br/>
sex:<input type="text" name="sex" value="女"><br/><br/> <input type="button" value="submit" onclick="submitUserList_4();">
</form>
</body>
</html>
Java
@RequestMapping(value = "/submitUserList_4", method={RequestMethod.POST})
@ResponseBody
public String submitUserList_4(@RequestBody List<User> users)
throws Exception{
String result = "";
if(users == null || users.size() <= 0){ return "No any ID.中文"; }
result = this.showUserList(users);
return result;
}
启动SpringMVC的注解功能，完成请求和注解POJO的映射
<!-- 自动扫描该包，使SpringMVC认为包下用了@controller注解的类是控制器 -->
<context:component-scan base-package="com.leon" />
<!--避免IE执行AJAX时，返回JSON出现下载文件 -->
<bean id="mappingJacksonHttpMessageConverter"
class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter">
<property name="supportedMediaTypes">
<list>
<value>text/html;charset=UTF-8</value>
</list>
</property>
</bean>
<!-- 启动SpringMVC的注解功能，完成请求和注解POJO的映射 -->
<bean
class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">
<property name="messageConverters">
<list>
<ref bean="mappingJacksonHttpMessageConverter" /> <!-- JSON转换器 -->
</list>
</property>
</bean>
POM
<!-- 映入JSON -->
<dependency>
<groupId>org.codehaus.jackson</groupId>
<artifactId>jackson-mapper-asl</artifactId>
<version>1.9.13</version>
</dependency>
js
$.fn.serializeJson = function(){
var jsonData1 = {};
var serializeArray = this.serializeArray();
// 先转换成{"id": ["12","14"], "name": ["aaa","bbb"], "pwd":["pwd1","pwd2"]}这种形式
$(serializeArray).each(function () {
if (jsonData1[this.name]) {
if ($.isArray(jsonData1[this.name])) {
jsonData1[this.name].push(this.value);
} else {
jsonData1[this.name] = [jsonData1[this.name], this.value];
}
} else {
jsonData1[this.name] = this.value;
}
});
// 再转成[{"id": "12", "name": "aaa", "pwd":"pwd1"},{"id": "14", "name": "bb", "pwd":"pwd2"}]的形式
var vCount = 0;
// 计算json内部的数组最大长度
for(var item in jsonData1){
var tmp = $.isArray(jsonData1[item]) ? jsonData1[item].length : 1;
vCount = (tmp > vCount) ? tmp : vCount;
}
if(vCount > 1) {
var jsonData2 = new Array();
for(var i = 0; i < vCount; i++){
var jsonObj = {};
for(var item in jsonData1) {
jsonObj[item] = jsonData1[item][i];
}
jsonData2.push(jsonObj);
}
return JSON.stringify(jsonData2);
}else{
return "[" + JSON.stringify(jsonData1) + "]";
}
};
修改的js，返回json的数组对象
$.fn.serializeJson = function(){
var jsonData1 = {};
var serializeArray = this.serializeArray();
// 先转换成Object{id:Array(2),name:Array(2),pwd:Array(2)}==>{"id": ["12","14"], "name": ["aaa","bbb"], "pwd":["pwd1","pwd2"]}这种形式,即属性数组形式
$(serializeArray).each(function () {
if (jsonData1[this.name]) {
if ($.isArray(jsonData1[this.name])) {
jsonData1[this.name].push(this.value);
} else {
jsonData1[this.name] = [jsonData1[this.name], this.value];
}
} else {
jsonData1[this.name] = this.value;
}
});
// 再转成[Object,Object]==>[{"id": "12", "name": "aaa", "pwd":"pwd1"},{"id": "14", "name": "bb", "pwd":"pwd2"}]的形式,即对象数组
var vCount = 0;
// 计算json内部的数组最大长度
for(var item in jsonData1){
var tmp = $.isArray(jsonData1[item]) ? jsonData1[item].length : 1;
vCount = (tmp > vCount) ? tmp : vCount;
}
var jsonData2 = new Array();
if(vCount > 1) {
for(var i = 0; i < vCount; i++){
var jsonObj = {};
for(var item in jsonData1) {
jsonObj[item] = jsonData1[item][i];
}
jsonData2.push(jsonObj);
}
}else{
jsonData2.push(jsonData1);
}
return jsonData2;//返回的是json的对象数组
};
总结：最关键的是JS中的拼接json数据，ajax请求的属性以及后台接收的参数
SpringMVC将表单对象序列化成Json字符串提交，以List接收的更多相关文章
- C#将对象序列化成JSON字符串
C#将对象序列化成JSON字符串 public string GetJsonString() { List<Product> products = new List<Product& ...
- 使用 EntityFramework后把一个对象序列化成json字符串引起循环引用的问题
先看一个T4模板生成的model实体类 著作权归作者所有. 商业转载请联系作者获得授权,非商业转载请注明出处. 作者:卷猫 链接:http://anneke.cn/ArticleInfo/Detial ...
- .net 将List序列化成Json字符串
将List类型转化为Json,是我们平常开发时最常见的了.在使用中,有很多种方法,也可以使用. 第一种 第三方组件:Newtonsoft.Json.dll //转化成Json Newtonsoft.J ...
- 对象序列化成Json字符串 及 反序列化成对象
一. public static string JsonSerializer<T>(T t) { DataContractJsonSerializer ...
- Spring Boot Cache配置 序列化成JSON字符串
当我们使用@Cacheable注解的时候会将返回的对象缓存起来,我们会发现默认缓存的值是二进制的,不方便查看,为此我们自定义序列化配置,改成JSON格式的 配置如下: pom.xml <?xml ...
- jackson2.8.4java对象序列化成json字符串格式化时间
public class User {private int id; private Date birthday; private double money; private String name; ...
- JQuery将form表单值转换成json字符串函数
由于后台接口限定,必须要将表单内容转换成json字符串提交,因此写了一个将form表单值转成json字符串的函数. 前提:页面引入了JQuery 下面直接上代码 一.代码 / ...
- jQuery表单验证以及将表单序列化为json对象小练习
jquery表单验证(非实时验证),同时,将表单序列化为json对象提交表单. <!DOCTYPE html> <html lang="en"> <h ...
- form表单序列化为json格式数据
在web开发过程中,经常遇到将form序列化不能格式的字符串提交到后台,下面就介绍怎样将form表单序列化为json字符串. 首先,是扩展的jquery序列化插件,依赖jquery.经测试,这段代码可 ...
随机推荐
- Loj 2534 异或序列
Loj 2534 异或序列 考虑莫队离线处理.每加一个数,直接询问 \(a[x]\oplus k\) 的前/后缀数目即可,减同理. 利用异或的优秀性质,可以维护异或前缀和,容易做到每次 \(O(1)\ ...
- 理解 Roslyn 中的红绿树（Red-Green Trees）
Roslyn 的 API 是非常易用的.即便如此复杂的 C# 语法,建立的复杂的 C# 语法树,还有其复杂的树遍历和修改过程,也都被其 API 包装得干净简洁. 而这背后是它的重要设计思路 —— 红绿 ...
- js中confirm揭示三个按钮“是”“否”“取消”
js中confirm提示三个按钮“是”“否”“取消” 重载DOM中confirm window.confirm = function(str) { str=str.replace(/\'/g, & ...
- 文件上传 jqueryForm
关于formData方式ajax上传文件的方式在笔者随笔开发日记5-18中有描述,在此不做记录. 由于之前使用的是formData方式上传文件,但是在后期处理浏览器兼容问题的时候出现头痛的事情,for ...
- LG4169 [Violet]天使玩偶/SJY摆棋子
题意 Ayu 在七年前曾经收到过一个天使玩偶,当时她把它当作时间囊埋在了地下.而七年后 的今天,Ayu 却忘了她把天使玩偶埋在了哪里,所以她决定仅凭一点模糊的记忆来寻找它. 我们把 Ayu 生活的小镇 ...
- MySQL Geometry扩展在地理位置计算中的效率优势
由于在Geometry中,有相关自带函数和SPATIAL INDEX的性能优化,可以让某些位置计算的效率提升.以下是几种计算方法的效果对比. 1. 数据准备 首先创建一个数据表,这是一个店铺数据表,结 ...
- sqlserver docker 安装部署试用
1. 镜像 docker pull exoplatform/sqlserver 2. 镜像参数 docker run -d -e SA_PASSWORD=<passord> -e ...
- PHP面向对象（OOP）----访问限制符
访问控制修饰符指public.protected.private三个关键词来修饰类的成员属性和成员方法,可以有不同的权限 public:[共有的]类里面调用和类外面调用都是可以的 protected: ...
- 如何将angular-ui-bootstrap的图片轮播组件封装成一个指令
在项目开发中我们经常会遇到图片轮播的功能点: 如果我们开发人员自己原生手写,将会花费很多的时间,最终得不偿失. 接下来就详细说说如何使用angular-ui发热图片轮播模块,并且将它写成一个指令(便于 ...
- C#开机启动与退出程序
最新用到的项目中需要使用开机自启和退出程序,于是需要 http://www.cnblogs.com/Gaoswatou/p/6605760.html C# WinForm程序退出的方法 1.this. ...