将值从 thymeleaf 发送到 Spring Boot 服务类

Question

我正在测试一个使用 thymeleaf 的 Spring Boot 应用程序，但我找不到任何解释如何将选择选项值从 thymeleaf 发送到 Spring Boot 服务类的文档。

基本上，我想要实现的是从选择标签中获取值，以便我可以通过以下方法将它们插入数据库： 请注意：此方法在服务 class=> 它在控制器类中具有 get 和 post 映射。

public void addNewJob(JobPostEntity jobPostEntity, @RequestParam(value="selectCategory") String selectCategory) {
    jobPostEntity.setJobcategory("test");
    jobPostRepository.save(jobPostEntity);
}

百里香文件是：

<form th:action="@{/newjob}" th:object="${addNewJob}" method="post">
        <div class="form-group">
            <label for="">Offer Title</label> 
            <input type="text" th:field="*{jobtitle}"  class="form-control" placeholder="Entre Offer Title">
                 <small class="form-text text-muted">We'll never share your email
                with anyone else.</small>
        </div>

        <div class="form-group">
            <label >Company Name</label>
             <input type="text" th:field="*{jobcompany}"  class="form-control" placeholder="Enter Company Name">
        </div>


        <div class="form-group dropdown">
            <label for="sel1">Choose Category (select one):</label> 
            <select name="*selectCategory"
                class="form-control" id="selectCategory"
                onchange="getSelectedValue();" th:field="*{selectCategory}">

                <option  value="">Select Option</option>
                <option  value="software_engineer">Software Engineer</option>
                <option value="graphic_design ">Graphic Design</option>
                <option value="customer_service ">Customer Service</option>
                <option value="marketing" >Marketing</option>
                <option value="healthcare">Health Care</option>

            </select>
        </div>

        <div class="form-group">
            <label for="exampleInputPassword1">Offer</label>
            <textarea class="form-control" th:field="*{jobtext}" placeholder="Describe your job offer"></textarea>
        </div>
        <button type="submit" class="btn btn-primary">Submit Offer</button>
    </form>

Answer 1

首先，您需要正确配置控制器类。我假设这是您的 addNewJob 方法所在的位置，因此我在示例中使用了它。 您需要有一个 @GetMapping （与返回视图名称的 @RequestMapping(method = RequestMethod.GET) 相同（这是您的 thymeleaf 文件 -在下面的示例中，我为此使用了 jobForm.html）并映射到特定路径（示例中为 /test）。

  @GetMapping("/test")
  public String getTestView() {
    return "jobform";
  }

您还需要一个方法来创建/检索用于填写表单的模型对象。这被映射为 th:object=${addNewJob} 的形式：

  @ModelAttribute(value = "addNewJob")
  public JobPostEntity newEntity() {
    return new JobPostEntity();
  }

最后，您将需要一个带有@PostMapping 的方法，该方法在您提交表单时调用。在您的示例中，它映射到 /newjob，所以我也使用了它：

  @PostMapping(value = "/newjob")
  public void addNewJob(
      @ModelAttribute("addNewJob") final JobPostEntity myEntity) {
    System.out.println("got dto: " + myEntity);
    System.out.println("selectCategory: " + myEntity.getSelectedCategory());
  }

总而言之，控制器看起来像这样：

@Controller
public class TestController {

  @GetMapping("/test")
  public String getTestView() {
    return "jobform";
  }

  @PostMapping(value = "/newjob")
  public void addNewJob(
      @ModelAttribute("addNewJob") final JobPostEntity myEntity) {
    System.out.println("got dto: " + myEntity);
    System.out.println("selectCategory: " + selectCategory);
  }

  @ModelAttribute(value = "addNewJob")
  public JobPostEntity newEntity() {
    return new JobPostEntity();
  }

}

至于 select 选项是否起作用，我也会将该字段放在 modelAttribute 中，因此您不必单独对待它们：

public class JobPostEntity {

  private String jobtitle;
  private String jobcompany;
  private String jobtext;
  private String selectCategory;
 //getters/setters
}

您粘贴的 html 代码也包含一些问题：

• 您没有表单的开始标签
• 选择标签没有 thymeleaf 映射（th:field）
• 输入标签没有结束元素

对我有用的固定版本看起来像这样（不包括 body/head/etc 包装标签）：

<form th:action="@{/newjob}" th:object="${addNewJob}" method="post">
        <div class="form-group">
            <label for="">Offer Title</label> 
            <input type="text" th:field="*{jobtitle}"  class="form-control" placeholder="Entre Offer Title" />
                 <small class="form-text text-muted">We'll never share your email
                with anyone else.</small>
        </div>

        <div class="form-group">
            <label >Company Name</label>
             <input type="text" th:field="*{jobcompany}"  class="form-control" placeholder="Enter Company Name"/>
        </div>


        <div class="form-group dropdown">
            <label for="sel1">Choose Category (select one):</label> 
            <select name="*selectCategory"
                class="form-control" id="selectCategory"
                onchange="getSelectedValue();"
                th:field="*{selectCategory}">

                <option value="">Select Option</option>
                <option value="software_engineer">Software Engineer</option>
                <option value="graphic_design ">Graphic Design</option>
                <option value="customer_service ">Customer Service</option>
                <option value="marketing" >Marketing</option>
                <option value="healthcare">Health Care</option>

            </select>
        </div>

        <div class="form-group">
            <label for="exampleInputPassword1">Offer</label>
            <textarea class="form-control" th:field="*{jobtext}" placeholder="Describe your job offer"></textarea>
        </div>
        <button type="submit" class="btn btn-primary">Submit Offer</button>
    </form>

如果您启动应用程序并在浏览器中输入http://localhost:8080/test（如果您使用默认上下文路径/端口），则该表单应该会出现并按预期工作。

另外，你可以在这里找到一个很好的教程http://www.baeldung.com/thymeleaf-in-spring-mvc