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.经测试,这段代码可 ...
随机推荐
- Django项目部署（阿里云）（2）--扩展
新博客地址:http://muker.net/django-server-two.html 前面的只是最简单的部署,真实情况总是更复杂一点实际流程大概是这么操作的(我这种菜鸟的想法):本地写代码-&g ...
- 20179223《Linux内核原理与分析》第九周学习笔记
视频学习 进程调度与进程调度的时机分析 不同类型的进程有不同的调度需求 第一种分类: --I/O-bound:1.频繁的进行I/O:2.通常会花费很多时间等待I/O操作的完成 --CPU-bound: ...
- java中线程安全问题
在java中单线程和多线程是什么意思,他们有什么区别,分别的作用是什么? 在一个程序中,这些独立运行的程序片断叫作“线程”(Thread),利用它编程的概念就叫作“多线程处理”.多线程处理一个常见的例 ...
- drone 学习五 集成gitlab 配置以及简单测试
备注: 使用docker-compose 进行安装 同时集成gitlab,预备环境 docker docker-compose gitlab 1. docker-compose version: ...
- Nchan 实时消息内置变量
以下参考官方文档: $nchan_channel_idThe channel id extracted from a publisher or subscriber location requ ...
- 莫名其妙的js基础学习！
JavaScript基本组成部分: 1,ECMAScript:js的语法标准,基本的变量,运算符,函数,if语句,for语句等 2,DOM:操作网页上的元素API,比如盒子的移动,变色,轮播图等. 3 ...
- 【转】关于gcc、glibc和binutils模块之间的关系
原文网址:http://www.mike.org.cn/articles/linux-about-gcc-glibc-and-binutils-the-relationship-between-mod ...
- Markdown语法简单介绍
Markdown是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式. 一.标题 # 这是标题一 ## 这是标题二 ### 这是标题三 #### 这是标题 ...
- PAT1034. Head of a Gang ——离散化+并查集
题意:成员A与成员B通话 ,成员B与成员C通话,则 ABC即为一个团伙,一共有若干个团伙,每个团伙的人数大于2且相互通话时间超过一定值即为黑帮,每个黑帮伙里有一个BOSS,boss是与各个成员打电话最 ...
- happynear_caffe编译时，缺少头文件caffe.pb.h的问题
由于一些问题,需要编译caffe 的windows版本,用的是happynear的caffe版本,在caffe.pb.h遇到了问题 如何生成 caffe.pb.h 将protobuf 里的 proto ...