Question

我正在我的本地机器上使用Sprint Tool Suite开发Java的第一个表单。我创建了一个index.html页面，其中包含一个带有3个输入字段的简单表单我希望将表单提交到results.html页面，该页面只显示输入到表单中的值。我遇到的问题是，当我启动应用程序时，填写一些数据，然后单击提交按钮，我收到404错误。另外，我注意到当我点击提交按钮时，浏览器的URL框变为localhost：8080 / person。我希望看到localhost：8080 /结果。我提前感谢您的帮助。

我的主要应用程序类代码是：

package com.baconbuddy;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class BaconBuddyApplication {

    public static void main(String[] args) {
        SpringApplication.run(BaconBuddyApplication.class, args);
    }
}

我的index.html包含以下代码：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Home Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
</head>
<body>
    <h1>Hello world!</h1>

    <form action="#" th:action="@{/person}" th:object="${person}" method="post" >
        <input th:field="*{firstName}" placeholder="First Name" />
        <input th:field="*{lastName}" placeholder="Last Name" />
        <input th:field="*{age}" placeholder="Age" />
        <button >Submit</button>
    </form>
</body>
</html>

我的results.html有以下代码：

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Insert title here</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
    <div>
    <p>First Name:
    <span th:text="${person.firstName}"></span>
    </p>
    <br />
    <p>Last Name:
    <span th:text="${person.lastName}"></span>
    </p>
    <br />
    <p>Age:
    <span th:text="${person.age}"></span>
    </p>
    </div>
   </body>
</html>

我的Person.java文件如下所示：

package com.baconbuddy.models;

public class Person {

private String firstName;
private String lastName;
private int age;

public String getFirstName() {
    return firstName;
}
public void setFirstName(String firstName) {
    this.firstName = firstName;
}
public String getLastName() {
    return lastName;
}
public void setLastName(String lastName) {
    this.lastName = lastName;
}
public int getAge() {
    return age;
}
public void setAge(int age) {
    this.age = age;
}

}

我的HomeController.java看起来像这样：

package com.baconbuddy.controllers;

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 org.springframework.web.bind.annotation.RequestMapping;

import com.baconbuddy.models.Person;

@Controller
@RequestMapping({ "/", "/home" })
public class HomeController {

    @GetMapping()
    public String index(Model model) {
       model.addAttribute("person", new Person());

    // The string index will be looked for in src/main/resources/templates
    return "index";
    }

    @PostMapping()
    public String personSubmit(@ModelAttribute Person person) {
    return "results";
    }
}

Answer 1

您的@{/person} HTML中th:action为<form>，但您的控制器没有为其映射方法。您现在映射的POST映射到/和/home（继承自您的班级@RequestMapping）。更改@PostMapping或修改<form>，例如：

@PostMapping("person")
public String personSubmit(@ModelAttribute Person person) {
    return "results";
}

或更新您的表单：

<form action="#" th:action="@{/}" th:object="${person}" method="post" >

使用Java和Thymeleaf提交表单

1 个答案: