java - Springboot 复选框值到 Controller

Question

作为一个 springboot-thymeleaf 新手，我一直在阅读有关该主题的许多类似问题，但我仍然缺少语法和整体 Springboot Thymeleaf 范例中的一些内容。

Web 应用程序从后端数据库中提取由 Thymeleaf 模板呈现的项目数据。用户还可以生成数据的 pdf 报告，该报告也在浏览器中呈现。

实体:

@Entity
@Table(name = "REPORT_CS")
public class ReportItemCs {

    public ReportItemCs () {}

    @Id
    @Column(name = "ITEM_ID")
    private Long itemId;

    @Column(name = "PROJ_NUM")
    private String projectNumber;

    @Column(name = "REGION")
    private String region;

//  additional fields, getters, setters

首先，一些有效的东西:

thymeleaf 中的一个简单文本字段用于在 post 请求中传递字符串。 Controller 在将其作为 projectNumber 上的查询参数传递到存储库的位置处拾取它。该查询返回 thymeleaf 在表中呈现的对象列表。请注意，没有绑定(bind)到任何对象 - 它只是从 UI 发布字符串，然后将其作为查询参数传递。

HTML:

//Works without binding to backend

<section layout:fragment="content">

    <p>Quick Project Search:</p>

    <form method="post">
        <input type="text" name="keyword"
            placeholder="Project number keywords" /> <input type="submit"
            value="Search" />
    </form>

    <br /> <span th:text=" ${noProjectsMessage}"></span>

</section>

Controller :

@RequestMapping(value = "/", method = RequestMethod.POST)
    public String showProject(String keyword, ModelMap model) {



        List<ProjectView> p = repository.findByProjectsContaining(keyword);
            if (p.size() == 0) {

                model.put("noProjectsMessage",
                String.format("Project with id containing \"%s\" not found...", keyword));
                return "home";
            } else {

                model.put("projectViews", p);
            }
        return "show-projects";
    }

存储库:

    @Query("SELECT p FROM ProjectView p WHERE p.projectNumber like %?1%")
    List<ProjectView> findByProjectsContaining(@Param("keyword") String keyword);

所以，现在，我需要添加一些复选框，以按区域、项目类别等提供额外的过滤。我计划以两种方式使用这些复选框:1) 使用 jQuery 动态过滤 UI 中的项目列表，另外，将复选框值传递回 Controller ，以便它们可用于填充 pdf 模板标题。然后，我要么执行另一个数据库查询，要么使用 Stream() 过滤原始查询生成的列表，并将过滤后的列表发送到 pdf 服务。当用户单击“PDF”按钮时，复选框值将转发到 pdf 服务，在该服务中生成报告标题和报告，并在单独的选项卡中作为字节流返回。

HTML

<div class="form-check">

<form th:action="@{/cs-report}" method="post">
<label for="form-check">Region</label>

<input class="form-check-input" type="checkbox" value="all" name="regions" id="allOffice" />
<label class="form-check-label" for="allOffice">Select All</label>

<input class="form-check-input" type="checkbox" value="region1" name="regions" id="region1"/>
<label class="form-check-label" for="region1">Region 1</label>

<input class="form-check-input" type="checkbox" value="region2" name="regions" id="region2"/>
<label class="form-check-label" for="region2">Region 2</label>

<input class="form-check-input" type="checkbox" value="region3" name= "regions" id="region3"/>
<label class="form-check-label" for="region1">Region 3</label>


<button type="submit" class="btn btn-primary">Test Checkboxes</button>
</form>

</div>

Controller

//Test the post method

@RequestMapping(value = "/cs-report", method = RequestMethod.POST)

public void printCheckboxValues(List<String> regions)

{

regions.foreach(s -> System.out.println(s));


}

如果这种方法有效，存储库将类似于:

    @Query("SELECT p FROM ProjectView p WHERE p.region IN 1")
    List<ProjectView> findByRegion(@Param("regions") List<String> regions);

我认为 Controller 使用名称属性来引用复选框值列表，但我不清楚如何设置 Controller 来执行此操作。我见过的大多数示例都将复选框绑定(bind)到其父对象，也许这就是需要做的。我对复选框进行了硬编码，因为没有那么多，而且我不希望数据库中的值发生变化。但如果我确实需要将复选框“region”值绑定(bind)到reportCs 实体，那么我们将非常感谢语法示例。

任何其他有关方法的建议都将受到极大的赞赏，如果代码可以概括为从多个复选框组中获取多个参数，则会带来巨大的好处。谢谢。

Answer 1

好的，复选框需要绑定(bind)到表单支持 bean。对 Thymeleaf 语法​​进行了一些修改，但这样做实际上对于将多个复选框组绑定(bind)到多个查询参数来说非常方便。另外，我意识到对模板中的复选框值进行硬编码是一个坏主意(不是松散耦合的代码，并且会产生问题)，因此我的下一步是从数据库动态获取复选框值。感谢您的阅读。

html:

<div class="form-check">

<form action="#" th:action="@{/cs-report}" th:object="${queryDto}" method="post">
    <button type="submit" class="btn btn-primary">Get Report</button>

<input class="form-check-input" type="checkbox" value="all" name="all" id="all" />
<label class="form-check-label" for="all">Select All</label>

<input class="form-check-input" type="checkbox" value="region1" name="regions" th:field="*{regions}" id="region1" />
label class="form-check-label" for="region1">Region 1</label>

<input class="form-check-input" type="checkbox" value="region2" name="regions" th:field="*{regions}" id="region2" />
label class="form-check-label" for="region2">Region 2</label>

<input class="form-check-input" type="checkbox" value="region3" name="regions" th:field="*{regions}" id="region3" />
label class="form-check-label" for="region3">Region 3</label>

</form>

</div>

DTO 对象:

// Form-backing bean to hold checkbox values on post submission
public class QueryDto {


    private List<String> regions;
    // Getter, setters

Controller

    @PostMapping(value = "/cs-report")
    public String testCheckboxes(@ModelAttribute QueryDto queryDto) throws IOException {

List<ReportDto> dtos = repository.findByRegion(queryDto.getRegions());

dtos.foreach(s -> System.out.println(s.getProjectRegion()));
}

存储库

@Query("SELECT p FROM ProjectView p WHERE p.region IN :regions")
    List<ProjectView> findByRegion(@Param("regions") List<String> regions);