java - 在 Thymeleaf 数组中输入

Question

我需要从一个数组中选择值并将其分配给另一数组。使用 Spring Thymeleaf。不知道如何检索这些选择的值。我的类(class):

@Entity
public class Collaborator {
   @Id
   @GeneratedValue(strategy = GenerationType.IDENTITY)
   private Long id;

   @NotNull
   @Size (min=3, max=32)
   private String name;

   @NotNull
   @ManyToOne (cascade = CascadeType.ALL)
   private Role role;

   public Collaborator() {}...

@Entity
public class Role {
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long id;

    @NotNull
    @Size(min = 3, max = 99)
    private String name;

    public Role() {}....

我的 Controller :

@RequestMapping("/project_collaborators/{projectId}")
public String projectCollaborators(@PathVariable Long projectId, Model model) {
    Project project = mProjectService.findById(projectId);
    List<Collaborator> allCollaborators = mCollaboratorService.findAll();
    List<Collaborator> assignments = new ArrayList<>();

    if (project.getRolesNeeded()!=null) {
        for (int i=0;i<project.getRolesNeeded().size();i++) {
            assignments.add(new Collaborator("Unassigned", project.getRolesNeeded().get(i)));
            assignments.get(i).setId((long) 0);
        }
    }

    model.addAttribute("assignments", assignments);
    model.addAttribute("allCollaborators", allCollaborators);
    model.addAttribute("project", project);

    return "project_collaborators";
}

@RequestMapping(value = "/project_collaborators/{projectId}", method = RequestMethod.POST)
public String projectCollaboratorsPost(@ModelAttribute Project project, @PathVariable Long projectId, Model model) {
    Project p = mProjectService.findById(projectId);


    //mProjectService.save(project);
    return "redirect:/project_detail/{projectId}";
}

和模板:

            <form th:action="@{'/project_collaborators/' + ${project.id}}" method="post" th:object="${project}">
                <label th:text="'Edit Collaborators: ' + ${project.name}">Edit Collaborators: Website Project</label>
                <ul class="checkbox-list">

                    <li th:each="a : ${assignments}">
                        <span th:text="${a.role.name}" class="primary">Developer</span>
                        <div class="custom-select">
                            <span class="dropdown-arrow"></span>
                            <select th:field="${a.id}">
                                <option th:each="collaborator : ${allCollaborators}" th:value="${collaborator.id}" th:text="${collaborator.name}">Michael Pemulis</option>
                            </select>
                        </div>
                    </li>

                </ul>
                <div class="actions">
                    <input type="submit" value="Save" class="button"/>
                    <a href="#" class="button button-secondary">Cancel</a>
                </div>
            </form>

如您所见，我想让用户为每个角色(roleNeeded)选择(allCollaborators)中的任何协作者，并将该分配保留在列表(分配)中。

我收到错误消息:

ava.lang.IllegalStateException: Neither BindingResult nor plain target object for bean name 'a' available as request attribute

所以问题是:如何解决这个问题，将值从一个数组分配给模板中的另一个数组，并在我的 Controller 中检索该值。

Answer 1

异常原因

您收到的 IllegalStateException 是因为 select 元素中的 th:field="${a.id}" 必须相关到表单 th:object="${project}" 元素； th:field 属性必须引用 project 实例中的实际字段(您还需要编写 th:field="*{fieldName}" )。这应该可以解决您遇到的异常，但不会解决您的整个问题，因为它的第二部分与如何使值进入您的 Controller 有关，我将在接下来解释。 p>

将值发送到您的 Controller

要将这些值输入 Controller ，您需要进行一些更改。由于我并不真正了解您的 Project 类的代码，因此我将更改一些内容，以便您能够弄清楚如何使这个简单的示例适应您的特定情况。

首先，我知道您希望在表单中建立如下所示的关系:

• 角色 1 => 协作者 A
• 角色2 => 协作者B

您的 Controller 需要接收一个列表，为了接收此信息，我们需要两个类:

• 将存储单个元素数据的类，将角色 ID 与协作者 ID 进行映射:

  public class RoleCollaborator {
  
      private Long roleId;
  
      private Long collaboratorId;
  
      public Long getRoleId() {
          return roleId;
      }
  
      public void setRoleId(Long roleId) {
          this.roleId = roleId;
      }
  
      public Long getCollaboratorId() {
          return collaboratorId;
      }
  
      public void setCollaboratorId(Long collaboratorId) {
          this.collaboratorId = collaboratorId;
      }
  
  }
  

• 用于存储单个映射列表的包装类:

  public class RolesCollaborators {
  
      private List<RoleCollaborator> rolesCollaborators;
  
      public List<RoleCollaborator> getRolesCollaborators() {
          return rolesCollaborators;
      }
  
      public void setRolesCollaborators(List<RoleCollaborator> rolesCollaborators) {
          this.rolesCollaborators = rolesCollaborators;
      }
  
  }
  

下一步要做的是更改 Controller ，其中有两种方法，一种处理 GET 请求，另一种处理 POST 请求，从而接收表单数据。

在 GET 中:

public String projectCollaborators(@PathVariable Long projectId, Model model) {
    (... your code ...)

    model.addAttribute("project", project);

    // Add the next line to add the "rolesCollaborators" instance
    model.addAttribute("rolesCollaborators", new RolesCollaborators());

    return "project_collaborators";
}

如您所见，我们添加了一条将由 thymeleaf 模板使用的行。现在是角色和协作者的空列表的包装，但如果您需要编辑现有映射而不是添加新映射，则可以添加值。

在帖子中:

// We changed the @ModelAttribute from Project to RolesCollaborators
public String projectCollaboratorsPost(@ModelAttribute RolesCollaborators rolesCollaborators, @PathVariable Long projectId, Model model) {
   (... your code ...)
}

此时，您的 Controller 已准备好接收从您的表单发送的信息，我们也需要修改该信息。

<form th:action="@{'/project_collaborators/' + ${project.id}}" method="post" th:object="${rolesCollaborators}">
    <label th:text="'Edit Collaborators: ' + ${project.name}">Edit Collaborators: Website Project</label>
    <ul class="checkbox-list">

        <li th:each="a, stat : ${assignments}">
            <span th:text="${a.role.name}" class="primary">Developer</span>

            <div class="custom-select">
                <input type="hidden" th:id="rolesCollaborators[__${stat.index}__].roleId" th:name="rolesCollaborators[__${stat.index}__].roleId" th:value="${a.role.id}" />
                <span class="dropdown-arrow"></span>
                <select th:field="*{rolesCollaborators[__${stat.index}__].collaboratorId}">
                    <option th:each="collaborator : ${allCollaborators}" th:value="${collaborator.id}" th:text="${collaborator.name}">Michael Pemulis</option>
                </select>
            </div>
        </li>

    </ul>
    <div class="actions">
        <input type="submit" value="Save" class="button"/>
        <a href="#" class="button button-secondary">Cancel</a>
    </div>
</form>

这里有一些变化:

• 正如我在异常原因中指出的，您需要将 th:object="${project}" 更改为 th:object="${rolesCollaborators}"，因为 RolesCollaborator 是实例名称，您将从 GET Controller 方法接收值，并将值发送到 POST Controller 方法。
• 我添加了一个隐藏输入；此输入将存储将与用户使用 select 元素从界面中选择的协作者 ID 关联发送的角色 ID。看一下所使用的语法。
• 我更改了 select 元素的 th:field 值，以引用我们在 中使用的 rollesCollaborators 对象中的字段th:object="${rolesCollaborators}" 表单属性。这将在 RolesCollaborators 包装列表的 RoleCollaborator 元素中设置协作者的值。

通过这些更改，您的代码将可以工作。当然，您可以通过一些其他修改来改进它，但我尝试不引入更多修改来关注您的问题。