如何将列表数据百日咳html从弹簧控制器绑定?

时间:2017-03-03 06:49:04

标签: spring spring-mvc spring-boot spring-data thymeleaf

这是我的Controller类

    package com.myblog.controller;

import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PostMapping;

import com.myblog.model.User;

@Controller
public class UserController {

    private static final Logger log = LoggerFactory.getLogger(UserController.class);

    @GetMapping(value="/user")
    public String getUser(Model model){
        model.addAttribute("user", new User());
        return "user";
    }
    @PostMapping(value="/user")
    public String postUser(@ModelAttribute("user") User user){
        log.info("user :"+user);
        return "user";
    }
}

这是我的模型类 user.java

package com.myblog.model;

import java.util.ArrayList;
import java.util.List;

public class User {

    private int id;
    private String name;
    private List<Address> address=new ArrayList<Address>();

    @Override
    public String toString() {
        return "User [name=" + name + ", address=" + address + "]";
    }
    public int getId() {
        return id;
    }
    public void setId(int id) {
        this.id = id;
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public List<Address> getAddress() {
        return address;
    }
    public void setAddress(List<Address> address) {
        this.address = address;
    }


}

address.java

package com.myblog.model;


public class Address {

    private int id;
    private String street;
    private String city;

    public int getAddid() {
        return addid;
    }
    public void setAddid(int addid) {
        this.addid = addid;
    }
    public String getStreet() {
        return street;
    }
    public void setStreet(String street) {
        this.street = street;
    }
    public String getCity() {
        return city;
    }
    public void setCity(String city) {
        this.city = city;
    }

}

这是我的百万美元HTML页面

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Page Title</title>
<link href="/static/css/bootstrap.min.css" rel="stylesheet" media="screen" th:href="@{css/bootstrap.min.css}"/>
<script src="/static/js/bootstrap.min.js" th:src="@{js/bootstrap.min.js}"></script>
          </head>
    <body>
    <div class="container">
    <h1> User Account</h1>
    <form class="form-horizontal" th:action="@{/user}" method="POST" th:object="${user}">
      <div class="form-group">
        <label for="inputDescription" class="col-sm-2 control-label">Full Name</label>
        <div class="col-sm-5">
          <input type="text"  class="form-control" name="name"   placeholder="Full name"/>
        </div>
      </div>
      <div class="form-group">
        <label for="inputDescription" class="col-sm-2 control-label">Address</label>
        <div class="col-sm-5">
          <input type="text"  class="form-control" name="address.city"  placeholder="City"/>
        </div>
      </div>

    <div class="form-group">
            <label for="inputDescription" class="col-sm-2 control-label">Street</label>
        <div class="col-sm-5">
                   <input type="text"  class="form-control"  name="address.street" placeholder="street" />
          </div>
      </div>
      <div class="form-group">
          <label class="col-sm-2 control-label"></label>
            <div class="col-sm-10">
                <input type="submit" class="btn btn-primary" value="Add"/>
             </div>
      </div>
    </form>
    </div>
    </body>
    </html>
控制器用户对象中的

不会将数据绑定到地址模型对象中。 输出是user:user [name =&#34; name&#34;,address []]

2 个答案:

答案 0 :(得分:1)

您的表单似乎只管理一个地址,但您的域模型指定了一个地址列表。在这种情况下,您需要为第一个地址命名输入字段,例如address [0] .street,依此类推。

所以我考虑使用thymleaf迭代器(th:each)来使表单中的所有地址都可管理。然后使用th:field而不是定义名称属性。这应该可以解决你的问题。

答案 1 :(得分:0)

<form class="form-horizontal" th:action="@{/user}" method="POST" th:object="${user}">
  <div class="form-group">
    <label for="inputDescription" class="col-sm-2 control-label">Full Name</label>
    <div class="col-sm-5">
      <input type="text"  class="form-control"   th:field="*{name}" placeholder="Full name"/>
    </div>
  </div>
  <div class="form-group">
    <label for="inputDescription" class="col-sm-2 control-label">Address</label>
    <div class="col-sm-5">
      <input type="text"  class="form-control"  th:field="*{address[0].city}" placeholder="City"/>
    </div>
  </div>

<div class="form-group">
    <label for="inputDescription" class="col-sm-2 control-label">Street</label>
    <div class="col-sm-5">
      <input type="text"  class="form-control"  th:field="*{address[0].street}" placeholder="street" />
    </div>
  </div>
  <div class="form-group">
      <label class="col-sm-2 control-label"></label>
        <div class="col-sm-10">
            <input type="submit" class="btn btn-primary" value="Add"/>
         </div>
  </div>
</form>