I've designed a very dummy form with Java, Spring and MySQL aiming which takes name and mail variables as an input and post these variables into user
MySQL table which also has two columns as name and email. However once I use th:field
inside form.html
that is the main html file in the template folder.
My dependencies are:
- Thymeleaf = 2.5.5
- Spring JPA = 2.5.5
- JDBC API = 2.5.5
- Spring Web = 2.5.5
- MySQL Driver = 8.0.26
I've coded the UserEntity.java
as follows:
package com.example.demo;
import javax.persistence.Entity;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.Table;
@Entity // This tells Hibernate to make a table out of this class
@Table(name="user")
public class UserEntity {
@Id // stating it is the id
@GeneratedValue(strategy=GenerationType.AUTO) // stating auto_increment feature
private Integer id;
private String name;
private String email;
// getters and setters
UserRepository.java;
package com.example.demo;
import org.springframework.data.jpa.repository.JpaRepository;
// This will be AUTO IMPLEMENTED by Spring into a Bean called userRepository
// CRUD refers Create, Read, Update, Delete
public interface UserRepository extends JpaRepository<UserEntity, Integer> {
}
AccessingDataMysqlApplication.java;
package com.example.demo;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class AccessingDataMysqlApplication {
public static void main(String[] args) {
SpringApplication.run(AccessingDataMysqlApplication.class, args);
}
}
UserController.java
package com.example.demo;
import org.apache.catalina.User;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.servlet.ModelAndView;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import com.example.demo.UserEntity;
import com.example.demo.UserRepository;
@Controller
public class UserController {
@RequestMapping("/")
public ModelAndView welcome() {
ModelAndView modelAndView = new ModelAndView();
modelAndView.setViewName("form");
return modelAndView;
}
@Autowired private UserRepository userRepository;
@PostMapping("/add")
@ResponseBody
public String
addNewUser(@RequestParam String name, @RequestParam String email)
{
UserEntity newUser = new UserEntity();
newUser.setName(name);
newUser.setEmail(email);
userRepository.save(newUser);
return "User Created";
}
}
And finally form.html
<!DOCTYPE html>
<html xmlns:th="https://www.thymeleaf.org">
<head>
<link rel="stylesheet" type="text/css" href="../static/css/styles.css" media="screen">
<title>Job Application Form</title>
</head>
<body>
<h1>Form</h1>
<form th:action="@{/add}"
th:object="${user}"
method="POST">
<div>
<div>Name: <input type="text" th:field="*{name}" required></div>
<div>Email: <input type="text" th:field="*{email}" required></div>
</div>
<div>
<input type="submit" value="Submit"> <input type="reset" value="Reset">
</div>
</form>
</body>
</html>
CodePudding user response:
The form expects a user-object (th:object="${user}
) so you should provide this with the initial get-method
@RequestMapping("/")
public ModelAndView welcome() {
ModelAndView modelAndView = new ModelAndView();
modelAndView.setViewName("form");
modelAndView.addObject("user", new UserEntity()); // <----
return modelAndView;
}
and the post-endpoint should handle the completed 'user'
@PostMapping("/add")
public String addNewUser( UserEntity user, ....);
...
userRepository.save(user);
...
}
Have a look here Bealdung spring-boot-crud-thymeleaf