讓 SpringMVC 接收多個對象的4種方法

jopen 9年前發布 | 242K 次閱讀 SpringMVC Spring MVC Web框架

問題背景：

我要在一個表單里同時一次性提交多名乘客的個人信息到SpringMVC，前端HTML和SpringMVC Controller里該如何處理？

第1種方法：表單提交，以字段數組接收；

第2種方法：表單提交，以BeanListModel接收；

第3種方法：將Json對象序列化成Json字符串提交，以List接收；

第4種方法：將表單對象序列化成Json字符串提交，以List接收；
第4種方法其實是第3種方法的升級，就是將表單轉成Json對象，再轉成Json字符串提交；
然而，第4種方法還不支持含有多選控件表單的提交，故應該還有第5種加強版的方法。

以上4種方法都共用同一個User實體類，代碼如下：

public class User {

private Integer id;
private String name;
private String pwd;

@Override
public String toString() {
    return "User{" +
            "id=" + id +
            ", name='" + name + '\'' +
            ", pwd='" + pwd + '\'' +
            '}';
}
// .......后面還有getter、setter方法，省略了

}</pre> 
第1種方法：表單提交，以字段數組接收 

HTML代碼如下： 

    <form action="/user/submitUserList_1" method="post">
        ID:<input type="text" name="id"><br/>
        Username:<input type="text" name="name"><br/>
        Password:<input type="text" name="pwd"><br/><br/>

    ID:<input type="text" name="id"><br/>
    Username:<input type="text" name="name"><br/>
    Password:<input type="text" name="pwd"><br/><br/>
    <input type="submit" value="submit">
</form></pre> <p>Java代碼如下： </p>

    @RequestMapping(value = "/submitUserList_1", method ={RequestMethod.POST})
    @ResponseBody
    public String submitUserList_1(HttpServletResponse response,Integer[] id, String[] name, String[] pwd)
                            throws Exception{
        String result = "";
        if(id == null || id.length <= 0){ return "No any ID.中文"; }
        List<User> userList = new ArrayList<User>();
        for (int i = 0; i < id.length; i++ ) {
            User user = new User();
            user.setId(id[i]);
            user.setName(name[i]);
            user.setPwd(pwd[i]);
            userList.add(user);
        }
        result = this.showUserList(userList);
        return result;
    }
 第2種方法：表單提交，以BeanListModel接收 

HTML代碼如下： 

    <form action="/user/submitUserList_2" method="post">
        ID:<input type="text" name="users[0].id"><br/>
        Username:<input type="text" name="users[0].name"><br/>
        Password:<input type="text" name="users[0].pwd"><br/><br/>

    ID:<input type="text" name="users[2].id"><br/>
    Username:<input type="text" name="users[2].name"><br/>
    Password:<input type="text" name="users[2].pwd"><br/><br/>
    <input type="submit" value="Submit">
</form></pre> <p>Java代碼： </p>

除了剛才公用的User類，還要封裝一個User的容器類UserModel： 

public class UserModel {
    private List<User> users;

public List<User> getUsers() {
    return users;
}

public void setUsers(List<User> users) {
    this.users = users;
}

public UserModel(List<User> users) {
    super();
    this.users = users;
}

public UserModel() {
    super();
}


}</pre> 
SpringMVC Controller方法： 

    @RequestMapping(value = "/submitUserList_2", method ={RequestMethod.POST})
    @ResponseBody
    public String submitUserList_2(UserModel users)
            throws Exception{
        String result = "";
        List<User> userList = users.getUsers();
        if(userList == null || userList.size() <= 0){ return "No any ID.中文"; }
        result = this.showUserList(userList);
        return result;
    }
 第3種方法：將Json對象序列化成Json字符串提交，以List接收 

HTML代碼： 

<head>
    <title>submitUserList_3</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <script language="JavaScript" src="/js/jquery.min.js" ></script>
    <script language="JavaScript" src="/js/jquery.json.min.js" ></script>
    <script type="text/javascript" language="JavaScript">
        function submitUserList_3() {alert("ok");
            var customerArray = new Array();
            customerArray.push({id: "1", name: "李四", pwd: "123"});
            customerArray.push({id: "2", name: "張三", pwd: "332"});
            $.ajax({
                url: "/user/submitUserList_3",
                type: "POST",
                contentType : 'application/json;charset=utf-8', //設置請求頭信息
                dataType:"json",
                //data: JSON.stringify(customerArray),    //將Json對象序列化成Json字符串，JSON.stringify()原生態方法
                data: $.toJSON(customerArray),            //將Json對象序列化成Json字符串，toJSON()需要引用jquery.json.min.js
                success: function(data){
                    alert(data);
                },
                error: function(res){
                    alert(res.responseText);
                }
            });
        }
    </script>
</head>
<body>
    <h1>submitUserList_3</h1>
    <input id="submit" type="button" value="Submit" onclick="submitUserList_3();">
</body></pre> 
Java代碼： 

    @RequestMapping(value = "/submitUserList_3", method ={RequestMethod.POST})
    @ResponseBody
    public String submitUserList_3(@RequestBody List<User> users)
            throws Exception{
        String result = "";
        if(users == null || users.size() <= 0){ return "No any ID.中文"; }
        result = this.showUserList(users);
        return result;
    }
 第4種方法：將表單對象序列化成Json字符串提交，以List接收 

HTML代碼： 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        ";
<html>
<head>
    <title>submitUserList_4</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <script language="JavaScript" src="/js/jquery.min.js" ></script>
    <script type="text/javascript" language="JavaScript">
        //將表單序列化成json格式的數據(但不適用于含有控件的表單，例如復選框、多選的select)
        (function($){
            $.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) + "]";
            }
        };
    })(jQuery);

    function submitUserList_4() {alert("ok");
        var jsonStr = $("#form1").serializeJson();
        //console.log("jsonStr:\r\n" + jsonStr);
        //alert(jsonStr);
        $.ajax({
            url: "/user/submitUserList_4",
            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">
        ID:<input type="text" name="id"><br/>
        Username:<input type="text" name="name"><br/>
        Password:<input type="text" name="pwd"><br/><br/>

    ID:<input type="text" name="id"><br/>
    Username:<input type="text" name="name"><br/>
    Password:<input type="text" name="pwd"><br/><br/>
    <input type="button" value="submit" onclick="submitUserList_4();">
</form>

</body>
</html></pre> 
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;
    }
 總結： 

第1、2種方法其實都有一個共同的BUG：假如提交三條記錄時，前面兩條記錄的某些字段不填值的話，在SpringMVC里接收不準確了。而且，每 2種方法在HMTL中需要給name屬性添加[下標]，如果下標有跨度的話（比如第一組控件下標是0,第二組下標是2），那么SpringMVC里其實的是0到2三個對象的，默認下標是1的那個對象全為null值。

第3、4種方法最實用。 

以上方法參考自以下URL：

http://www.cnblogs.com/wsw0515/p/3582627.html

http://www.oschina.net/question/917732_106601

http://jxd-zxf.iteye.com/blog/2072300

http://www.tashan10.com/jquery-jiang-biao-dan-xu-lie-hua-wei-jsondui-xiang/ 
來源：lutinghuan的博客

本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。

轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。

本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！

本文地址：http://www.baiduhome.net/lib/view/open1437316108912.html

SpringMVC Spring MVC Web框架

讓 SpringMVC 接收多個對象的4種方法

相關經驗

相關資訊

相關文檔

目錄