在Spring mvc中,实现学生信息填报操作,(1)填报页面显示名字、年龄、性别,使用table表格对form表单实现对齐,CSS样式实现定义显示样式。(2)填报成功后,显示填报信息,并显示一张ok图片。(3)填报失败后,显示失败信息,并显示一张失败图片。
时间: 2024-05-06 12:18:56 浏览: 117
实现学生信息填报操作的步骤如下:
1. 创建一个Spring MVC项目,并添加必要的依赖。
2. 在Controller中定义处理请求的方法,接收表单提交的数据。
3. 在JSP页面中,使用table表格对form表单进行布局,使用CSS样式定义显示样式。
4. 根据处理结果,显示填报信息和对应的图片。
下面是一个简单的示例代码:
Controller代码:
```
@Controller
public class StudentController {
@RequestMapping(value="/submit", method=RequestMethod.POST)
public String submit(Student student, Model model) {
// 处理表单提交的数据
boolean success = true;
if (success) {
model.addAttribute("student", student);
return "success";
} else {
model.addAttribute("message", "提交失败");
return "error";
}
}
}
```
JSP页面代码:
```
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>学生信息填报</title>
<style>
table {
border-collapse: collapse;
margin: 20px;
}
th, td {
padding: 10px;
text-align: left;
vertical-align: top;
border: 1px solid #ddd;
}
label {
display: block;
margin-bottom: 5px;
}
input[type="submit"] {
margin-top: 10px;
}
.success {
color: green;
}
.error {
color: red;
}
</style>
</head>
<body>
<h1>学生信息填报</h1>
<form action="${pageContext.request.contextPath}/submit" method="post">
<table>
<tr>
<th><label for="name">姓名:</label></th>
<td><input type="text" id="name" name="name" required></td>
</tr>
<tr>
<th><label for="age">年龄:</label></th>
<td><input type="number" id="age" name="age" required></td>
</tr>
<tr>
<th><label for="gender">性别:</label></th>
<td>
<label><input type="radio" name="gender" value="male" required>男</label>
<label><input type="radio" name="gender" value="female" required>女</label>
</td>
</tr>
<tr>
<td colspan="2"><input type="submit" value="提交"></td>
</tr>
</table>
</form>
<c:if test="${not empty student}">
<p class="success">提交成功!</p>
<table>
<tr>
<th>姓名:</th>
<td>${student.name}</td>
</tr>
<tr>
<th>年龄:</th>
<td>${student.age}</td>
</tr>
<tr>
<th>性别:</th>
<td>${student.gender == 'male' ? '男' : '女'}</td>
</tr>
</table>
<img src="${pageContext.request.contextPath}/images/ok.png" alt="成功">
</c:if>
<c:if test="${not empty message}">
<p class="error">${message}</p>
<img src="${pageContext.request.contextPath}/images/error.png" alt="失败">
</c:if>
</body>
</html>
```
在这个示例中,我们使用了JSP的EL表达式和JSTL标签库来实现动态显示填报信息和图片。
注意,我们需要在项目中添加ok.png和error.png两张图片,并在JSP页面中正确引用它们。同时,我们还需要在Spring MVC的配置文件中添加静态资源映射,以便访问这些图片。
阅读全文