前端页面添加数据到数据库时，防止重复出生日期并提示用户
以下是一个基本的前端页面，用于添加数据到数据库。在这个例子中，我们假设我们正在添加一个学生的信息，包括姓名、年龄和出生日期。如果数据库中已经存在相同的出生日期，系统会弹出一个警告框，提示用户输入的数据重复了。
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Add Student</title>
</head>
<body>
<h1>Add Student</h1>
<form method="post" th:action="@{/add-student}">
<label>Name:</label>
<input type="text" name="name" required><br><br>
<label>Age:</label>
<input type="number" name="age" required><br><br>
<label>Birth Date:</label>
<input type="date" name="birthdate" required><br><br>
<button type="submit">Save</button>
</form>
<div th:if="${error}">
<script th:inline="javascript">
alert('[[${error}]]');
</script>
</div>
</body>
</html>
在这个例子中，我们使用了 Thymeleaf 模板引擎来渲染页面。我们设置了一个表单，当用户提交数据时，数据将被发送到后端的 /add-student 端点。如果数据库中已经存在相同的出生日期，我们可以在后端处理这个错误，并将错误消息传递回前端。
以下是后端使用 Spring Boot 和 JPA 的完整代码。我们假设我们有一个名为 Student 的实体类，具有与前端表单中输入的字段相对应的属性。我们还假设我们使用 MySQL 数据库。我们在 application.properties 文件中设置了数据库连接参数。
@Entity
@Table(name = "students")
public class Student {
@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Long id;
private String name;
private int age;
@Temporal(TemporalType.DATE)
private Date birthdate;
// getters and setters
}
@Repository
public interface StudentRepository extends JpaRepository<Student, Long> {
List<Student> findByBirthdate(Date birthdate);
}
@Service
public class StudentService {
@Autowired
private StudentRepository studentRepository;
public void addStudent(Student student) throws Exception {
List<Student> students = studentRepository.findByBirthdate(student.getBirthdate());
if (!students.isEmpty()) {
throw new Exception("Duplicate birthdate");
}
studentRepository.save(student);
}
}
@Controller
public class StudentController {
@Autowired
private StudentService studentService;
@GetMapping("/add-student")
public String showAddStudentForm(Model model) {
model.addAttribute("student", new Student());
return "add-student";
}
@PostMapping("/add-student")
public String addStudent(@ModelAttribute Student student, Model model) {
try {
studentService.addStudent(student);
return "redirect:/students";
} catch (Exception e) {
model.addAttribute("error", e.getMessage());
return "add-student";
}
}
}
@SpringBootApplication
public class Application {
public static void main(String[] args) {
SpringApplication.run(Application.class, args);
}
}
在这个例子中，我们使用了 Spring Boot 和 JPA 来管理数据库连接和操作。我们创建了一个名为 StudentRepository 的接口，用于定义与数据库交互的方法。我们还创建了一个名为 StudentService 的服务，用于处理业务逻辑。在 addStudent 方法中，我们首先检查数据库中是否已经存在相同的出生日期。如果是，则抛出一个异常，并将错误消息传递回前端。否则，我们调用 studentRepository.save 方法来将学生信息保存到数据库中。
最后，我们创建了一个名为 StudentController 的控制器，用于处理 HTTP 请求。当用户访问 /add-student 端点时，我们渲染 add-student.html 模板，并将一个新的 Student 对象添加到模型中。当用户提交表单时，我们调用 addStudent 方法来处理数据，并根据结果重定向到适当的页面。
在 MySQL 数据库中，我们可以使用以下 SQL 语句来创建 students 表：
CREATE TABLE students (
id BIGINT PRIMARY KEY AUTO_INCREMENT,
name VARCHAR(100) NOT NULL,
age INT NOT NULL,
birthdate DATE NOT NULL
);
原文地址: https://www.cveoy.top/t/topic/nxuR 著作权归作者所有。请勿转载和采集!