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>

$.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.经测试,这段代码可 ...

随机推荐

ptr_fun
ptr_fun 分类: C/C++2012-05-05 20:21 593人阅读评论(0) 收藏举报 functionclassfunobjectreturningtypes 目录(?)[-] ...
linux下修改了tomcat端口之后无法访问
查看防火墙,是否将修改之后的端口加入防火墙规则内,如没有,加入规则内,重启防火墙,如果还是无法访问,请看第二步执行bin目录下shutdown.sh脚本,如果正常关闭,则执行startup.sh脚本 ...
Codeforces 1030E 【暴力构造】
LINK 题目大意:给你n个数,你可以交换一个数的任意二进制位,问你可以选出多少区间经过操作后异或和是0 思路充分必要条件: 区间中二进制1的个数是偶数区间中二进制位最多的一个数的二进制个数小于等 ...
《selenium2 python 自动化测试实战》（16）——js操作补充
js修改readonly属性我们看到这里日期框标签中有readonly属性,如果我们直接send_keys就无法输入内容,这时我们需要先去掉readonly属性: js ='document.get ...
spring--注入方式
1.正常方式: 在一个“value”标签注入值,并附有“property”标签结束. <beans xmlns="http://www.springframework.org/sche ...
tidb 安装试用&&以及安装几个问题解决
备注: tidb 听说已经很长时间了,一直无安装部署(主要是不像cockrouchdb 不见那么简单) 1. 环境准备(官方建议使用6台机器) // 我的机器准备(阿里云的,同时大家最好选择 ...
人人都要培养AIQ
在人工智能时代,要培养自己的AIQ,其中的关键还是区分事实.观点和推理,在平时的工作生活中关注AI的发展,了解AI的优缺点,尝试用AI的优势让自己工作和生活的更好. 如果说IQ是用来测量一个人的智商, ...
嵌入式linux问题杂锦
tftp 在开发板上不能获取共享文件,出现: Permission denied tftp: can't open 'myTcpTest': Permission denied 是因为,我在/sys目 ...
webstorm配置scss的小结
1)安装ruby 2)安装sass 3)配置webstorm 打开webstrom ->file->setting->Tools->file watcher 添加scss pr ...
本地Office Project计划表同步到SharePoint2013任务列表的权限问题
使用SharePoint做项目管理时,项目任务列表往往比较重要,通常使用任务列表体现项目计划,而这个任务列表经常会根据项目计划的变更而进行调整,但更多时候项目管理者会习惯在本地Project中维护这份 ...

SpringMVC将表单对象序列化成Json字符串提交，以List接收

SpringMVC将表单对象序列化成Json字符串提交，以List接收的更多相关文章

随机推荐

热门专题