Advance Form Example:
Add Form:
List Form:
Project Structure:
[Link]
package [Link];
import [Link].*;
@Entity
public class Employee {
@Id
@GeneratedValue(strategy = [Link])
private Long id;
private String name;
private String gender;
private String country;
private String photo; // will store file name
public Employee() {
}
public Long getId() {
return id;
}
public void setId(Long id) {
[Link] = id;
}
public String getName() {
return name;
}
public void setName(String name) {
[Link] = name;
}
public String getGender() {
return gender;
}
public void setGender(String gender) {
[Link] = gender;
}
public String getCountry() {
return country;
}
public void setCountry(String country) {
[Link] = country;
}
public String getPhoto() {
return photo;
}
public void setPhoto(String photo) {
[Link] = photo;
}
}
Create [Link]
<!DOCTYPE html>
<html xmlns:th="[Link]
<head>
<title>Employee Form</title>
</head>
<body>
<h2>Employee Form</h2>
<form action="/save" method="post" enctype="multipart/form-data"
th:object="${employee}">
<input type="hidden" th:field="*{id}"> <label>Name:</label><br>
<input type="text" th:field="*{name}" required><br>
<br> <label>Gender:</label><br> <input type="radio"
th:field="*{gender}" value="Male"> Male <input type="radio"
th:field="*{gender}" value="Female"> Female <input
type="radio" th:field="*{gender}" value="Other"> Other <br>
<br> <label>Country:</label><br> <select
th:field="*{country}" required>
<option value="">-- Select Country --</option>
<option value="Nepal">Nepal</option>
<option value="India">India</option>
<option value="USA">USA</option>
<option value="UK">UK</option>
<option value="Australia">Australia</option>
</select> <br>
<br> <label>Photo:</label><br> <input type="file"
name="photoFile" accept="image/*"><br>
<br>
<img th:src="@{'/employee-photos/' + ${[Link]}}"
alt="Photo"
width="120" height="120"
style="border:1px solid #ccc; margin-bottom:10px;">
<button type="submit">Save</button>
</form>
</body>
</html>
[Link] (for listing employee)
<!DOCTYPE html>
<html xmlns:th="[Link]
<head>
<title>Employee List</title>
</head>
<body>
<h2>Employee Records</h2>
<a href="/add">Add Employee</a>
<br>
<br>
<table border="1" cellpadding="8" cellspacing="0">
<tr>
<th>ID</th>
<th>Name</th>
<th>Gender</th>
<th>Country</th>
<th>Photo</th>
<th>Actions</th>
</tr>
<tr th:each="e : ${list}">
<td th:text="${[Link]}"></td>
<td th:text="${[Link]}"></td>
<td th:text="${[Link]}"></td>
<td th:text="${[Link]}"></td>
<td><img th:src="@{'/employee-photos/' + ${[Link]}}" width="70"
height="70" /></td>
<td><a th:href="@{'/edit/' + ${[Link]}}">Edit</a> | <a
th:href="@{'/delete/' + ${[Link]}}">Delete</a></td>
</tr>
</table>
</body>
</html>
Create Controller([Link])
package [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
import [Link];
@Controller
public class EmployeeController {
@Autowired
private EmployeeRepository repo;
// Folder to store uploads
private static final String UPLOAD_DIR = "employee-photos/";
@GetMapping("/")
public String home(Model model) {
[Link]("list", [Link]());
return "index";
}
@GetMapping("/add")
public String addForm(Model model) {
[Link]("employee", new Employee());
return "form";
}
@PostMapping("/save")
public String save(@ModelAttribute Employee e, @RequestParam("photoFile")
MultipartFile file) throws IOException {
if (![Link]()) {
String fileName = [Link]();
Path path = [Link](UPLOAD_DIR);
if () {
[Link](path);
}
[Link]([Link](UPLOAD_DIR + fileName), [Link]());
[Link](fileName);
}
[Link](e);
return "redirect:/";
}
@GetMapping("/edit/{id}")
public String edit(@PathVariable Long id, Model model) {
[Link]("employee", [Link](id).get());
return "form";
}
@GetMapping("/delete/{id}")
public String delete(@PathVariable Long id) {
[Link](id);
return "redirect:/";
}
}
[Link](interface)
package [Link];
import [Link];
import [Link];
public interface EmployeeRepository extends JpaRepository<Employee, Long> {
}
Create [Link] class
package [Link];
import [Link];
import [Link];
import [Link];
@Configuration
public class WebConfig implements WebMvcConfigurer {
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
[Link]("/employee-photos/**")
.addResourceLocations("file:employee-photos/");
}
}
Also Create Folder for uploading image(employee-photos)