数据的修改的效果就是在一个界面将现有数据显示出来。然后有一个修改的连接,点击后会跳转到修改的连接上。然后点击后进入修改信息界面。
所以首先要完成的就是先把所有的数据在前台遍历显示出来。
- 先在后台controller将数据录入到数组里,然后获取数组。
@GetMapping("/demo")
public String demo(Model model) {
List<Message> messageList = new ArrayList<>();
Message message;
message = new Message(1, "一");
messageList.add(message);
message = new Message(2, "二");
messageList.add(message);
message = new Message(3, "一2");
messageList.add(message);
message = new Message(4, "一3");
messageList.add(message);
model.addAttribute("messageList", messageList);
return "demo";
}
然后将数据在前台显示出来
前台for each语句如下
<div th:each="message:${messageList}">
<div th:text="${message.info}"></div>
<a th:href="@{/message/{id}/update(id=${message.id})}">修改</a>
<a th:href="@{/message/{id}/delete(id=${message.id})}">删除</a>
</div>
因为当时是连着删除一起写的。
这里边的each就是遍历输出
之前写过就不重复
下边的就是获取到message中的info属性。
然后href是含有参数的
具体写法就是如图。
然后点击修改后会跳转到新的界面
进行修改。
要获取到当前的信息 对信息进行修改
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>添加信息</title>
</head>
<body>
<div>
<form action="#" th:action="@{/message/update}" th:object="${message}" method="post">
<input type="text" th:field="*{id}" /><br>
<input type="text" th:field="*{info}" /><br>
<input type="submit" value="确认更新"/>
</form>
</div>
</body>
</html>
这里就把数据传到了这个html上 然后点击按钮 会进行更新。
在后台的controller中 代码如下
@GetMapping("/message/{id}/update")
public String update(@PathVariable("id") Integer id, Model model) {
Message message = new Message(1, "一");
System.out.println(id);
model.addAttribute("message", message);
return "update";
}
这里写的是变参的mapping获取方式。
然后要获取到id 通过id来改数
这里写的是一个假的数据库
正常就是通过id在数据库中进行数据处理的。
然后将修改数据的post请求完成
至于删除就和修改的原理差不多 只不过就是在删除时候连接的是数据库 删除前显示的数据 和 删除后的数据 就不同了。
因为不是连的数据库 用删除写假数据的意义也就不大了。
网友评论