Springboot Thymeleaf 实现数据添加、修改、查询、删除
1、引言
在Spring Boot中使用Thymeleaf模板引擎实现数据的添加、修改、查询和删除功能，通常步骤如下：
- 在Controller类中，定义处理HTTP请求的方法。
- 创建Thymeleaf模板来处理表单的显示和数据的绑定。
2、用户数据添加
1、 在Controller类中，定义处理HTTP请求的方法。
@Controller
@RequestMapping("/user")
public class UserController {@Autowiredprivate IUserService userService;@GetMapping("/addPage")public String addPage(){return "user/add";}@PostMapping("/add")@ResponseBodypublic String add(User user){boolean save = userService.save(user);return "success";}}
2、创建Thymeleaf 模板处理表单，模板存放在“templates/user/add.html”目录中
<!DOCTYPE html>
<html lang="en">
<head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>用户添加页面</title><!--style省略-->
</head>
<body> <div class="container"> <h2>用户添加</h2><form action="/user/add" method="post"><label for="name">姓名:</label> <input type="text" id="name" name="name" required> <label for="age">年龄:</label> <input type="number" id="age" name="age" min="0" required> <label for="email">邮箱:</label><input type="email" id="email" name="email" required> <label for="introduce">介绍:</label><textarea id="introduce" name="introduce" rows="4" required></textarea><label for="phone">电话号码:</label> <input type="tel" id="phone" name="phone" pattern="[0-9]{11}" placeholder="请输入11位数字" required> <input type="submit" value="提交"> </form> </div>
</body>
</html>
3、访问页面添加用户
http://127.0.0.1:8080/user/addPage
3、用户数据修改
1、 在Controller类中，定义处理HTTP请求的方法。
@Controller
@RequestMapping("/user")
public class UserController {@Autowiredprivate IUserService userService;@GetMapping("/editPage")public String editPage(Long id,Model model){User user = userService.getById(id);model.addAttribute("user",user);return "user/edit";}@PostMapping("/edit")@ResponseBodypublic String edit(User user){userService.updateById(user);return "success";}
}
2、创建Thymeleaf 模板处理表单和绑定数据，模板存放在“templates/user/edit.html”目录中
<!DOCTYPE html>
<html lang="en">
<head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>用户修改页面</title>
<!--style省略-->
</head>
<body> <div class="container"> <h2>用户修改</h2><form action="/user/edit" method="post"><input type="hidden" name="id" th:value="${user.id}" ><label for="name">姓名:</label><input type="text" id="name" name="name" th:value="${user.name}" required><label for="age">年龄:</label> <input type="number" id="age" name="age" min="0" th:value="${user.age}" required><label for="email">邮箱:</label> <input type="email" id="email" name="email" th:value="${user.email}" required><label for="introduce">介绍:</label><textarea id="introduce" name="introduce" rows="4" th:text="${user.introduce}" required></textarea><label for="phone">电话号码:</label> <input type="tel" id="phone" name="phone" pattern="[0-9]{11}" th:value="${user.phone}" placeholder="请输入11位数字" required><input type="submit" value="提交"> </form> </div>
</body>
</html>
3、访问页面修改用户
http://127.0.0.1:8080/user/editPage?id=1
4、用户数据查询
Thymeleaf 实现数据动态渲染
Thymeleaf实现数据分页
5、用户数据删除
1、 在Controller类中，定义处理HTTP请求的方法。 这里删除完用户，重定向到列表页。
@GetMapping("/delete")public String delete(Long id){userService.removeById(id);return "redirect:/user/list?pageNum=1";}
2、用户列表页模板添加删除按钮
<body> <h1>简历列表</h1><ul class="resume-list" th:with="users=${userPageInfo.list}"><li class="resume-item" th:each="user:${users}"><a href="/user/detail"><h2 th:text="${user.name}">张三</h2><p th:text="${user.introduce}">软件工程师，具有5年工作经验，擅长Java和前端技术。</p><p th:text="${user.phone}">联系方式：123-4567-8901</p></a><a class="delete-button" th:href="'/user/delete?id='+${user.id}" >删除</a></li></ul>
<div class="page-foot"><a th:class="${pageNum==userPageInfo.pageNum?'active':''}" th:href="'/user/list?pageNum='+${pageNum}" th:each="pageNum:${userPageInfo.navigatepageNums}" >[[${pageNum}]]</a>
</div></body>
删除按钮样式
.resume-item{display: flex;flex-direction: row;flex-wrap: nowrap;align-content: center;align-items: center;justify-content: space-between;}.delete-button{cursor: pointer;background: red;color: white;display: block;width: 50px;height: 30px;text-align: center;line-height: 30px;margin-right: 5%;border-radius: 5px;}
3、访问用户列表页删除用户
http://127.0.0.1:8080/user/list?pageNum=1
相关文章：
Springboot Thymeleaf 实现数据添加、修改、查询、删除
1、引言 在Spring Boot中使用Thymeleaf模板引擎实现数据的添加、修改、查询和删除功能，通常步骤如下： 在Controller类中，定义处理HTTP请求的方法。创建Thymeleaf模板来处理表单的显示和数据的绑定。 2、用户数据添加 1、 在Controller类中…...
关于 UnityEditorWindow
想要使用UnityEditorWindow作为调试窗口吗？ 这样做可以很方便的针对游戏中的重要对象做调试。 但是有一个很不方便的地方，OnGUI 的刷新频率不高，或者说需要鼠标点击之后才会重绘，如何解决这一问题？ 可以如下操作&am…...
小狐狸JSON-RPC：wallet_addEthereumChain（添加指定链）
wallet_addethereumchain（添加网络） var res await window.ethereum.request({"method": "wallet_addEthereumChain","params": [{"chainId": "0x64", // 链 ID （必填）"…...
Pandas | value_counts() 的详细用法
value_counts() 函数得作用 用来统计数据表中，指定列里有多少个不同的数据值，并计算每个不同值有在该列中的个数，同时还能根据指定得参数返回排序后结果。 返回得是Series对象 value_counts(values,sortTrue, ascendingFalse, normalizeFal…...
上岸美团了！
Hello，大家好，最近春招正在如火如荼，给大家分享一份美团的面经，作者是一份某双非的硕（只如初见668），刚刚通过了美团的3轮面试，已经拿到offer，以下是他的一些分享。 一面&…...
Gemma开源AI指南
近几个月来，谷歌推出了 Gemini 模型，在人工智能领域掀起了波澜。 现在，谷歌推出了 Gemma，再次引领创新潮流，这是向开源人工智能世界的一次变革性飞跃。 与前代产品不同，Gemma 是一款轻量级、小型模型&…...
LabVIEW智能家居安防系统
LabVIEW智能家居安防系统 随着科技的飞速发展和人们生活水平的不断提升，智能家居系统以其便利性和高效性，逐渐成为现代生活的新趋势。智能家居安防系统作为智能家居系统的重要组成部分，不仅能够提高家庭的安全性，还能为用户提供更…...
[蓝桥杯 2022 省 A] 求和
[蓝桥杯 2022 省 A] 求和 题目描述 给定 n n n 个整数 a 1 , a 2 , ⋯ , a n a_{1}, a_{2}, \cdots, a_{n} a1,a2,⋯,an, 求它们两两相乘再相加的和，即 S a 1 ⋅ a 2 a 1 ⋅ a 3 ⋯ a 1 ⋅ a n a 2 ⋅ a 3 ⋯ a n − 2 ⋅ a n − 1 a n − 2 ⋅ a…...
【C++入门】输入输出、命名空间、缺省参数、函数重载、引用、内联函数、auto、基于范围的for循环
目录 命名空间 命名空间的定义 命名空间的使用 输入输出 缺省参数 函数重载 引用 常引用 引用的使用场景 内联函数 auto 基于范围的for循环 命名空间 请看一段C语言的代码： #include <stdio.h> #include <stdlib.h>int rand 10;int main…...
Docker + Nginx 安装
安装Docker 1.防火墙 2.yum源 3.安装基础软件 更新yum源 wget -O /etc/yum.repos.d/CentOS-Base.repo http://mirrors.aliyun.com/repo/Centos-7.repo wget -O /etc/yum.repos.d/epel.repo http://mirrors.aliyun.com/repo/epel-7.repo yum clean all #清除yum源缓存 yu…...
UE RPC 外网联机（1）
技术：RPC TCP通信 设计：大厅服务<---TCP--->房间服务<---RPC--->客户端（Creator / Participator） 1. PlayerController 用于RPC通信控制 2.GameMode 用于数据同步 3.类图 4. 注意 （1）RPC&a…...
AI预测福彩3D第22弹【2024年3月31日预测--第5套算法开始计算第4次测试】
今天，咱们继续进行本套算法的测试，今天为第四次测试，仍旧是采用冷温热趋势结合AI模型进行预测。好了，废话不多说了。直接上结果~ 仍旧是分为两个方案，1大1小。 经过人工神经网络计算并进行权重赋值打分后，3…...
Django(二)-搭建第一个应用(1)
一、项目环境和结构 1、项目环境 2、项目结构 二、编写项目 1、创建模型 代码示例: import datetimefrom django.db import models from django.utils import timezone# Create your models here.class Question(models.Model):question_text models.CharField(max_length2…...
前端bugs
问题： Failed to load plugin typescript-eslint declared in package.json eslint-config-react-app#overrides[0]: Cannot find module eslint/package.json 解决： google了一晚上还得是chatgpt管用 运行以下命令【同时还要注意项目本身使用的Node版…...
MCGS学习——水位控制
要求 插入一个水罐，液位最大值为37插入一个滑动输入器，用来调节水罐水位，滑动输入器最大调节为液位最大值，并能清楚的显示出液位情况用仪表显示水位变化情况，仪表最大显示设置直观清楚方便读数，主划线为小…...
本地搭建多人协作ONLYOFFICE文档服务器并结合Cpolar内网穿透实现公网访问远程办公
文章目录 1. 安装Docker2. 本地安装部署ONLYOFFICE3. 安装cpolar内网穿透4. 固定OnlyOffice公网地址 本篇文章讲解如何使用Docker在本地服务器上安装ONLYOFFICE，并结合cpolar内网穿透实现公网访问。 Community Edition允许您在本地服务器上安装ONLYOFFICE文档&…...
Ubuntu 中电子邮件处理工具
Ubuntu 中电子邮件处理工具的综述 在现代通信技术中，电子邮件系统是不可或缺的一部分。特别是在基于 Linux 的操作系统如 Ubuntu 中，有许多高效且可靠的电子邮件处理工具可供选择。除了众所周知的 Postfix，还有其他几个重要的选项࿰…...
java多线程——运用线程同步解决线程安全问题
前言： 整理下学习笔记，打好基础，daydayup!!! 线程安全 多线程可以同时进行操作，但如果是同时操作一个共享资源的时候，可能会出现业务安全问题。 示例： 小A和小B共用一个账户，如果小A和小B同时取…...
Radio Silence for mac 好用的防火墙软件
Radio Silence for Mac是一款功能强大的网络防火墙软件，专为Mac用户设计，旨在保护用户的隐私和网络安全。它具备实时网络监视和控制功能，可以精确显示每个网络连接的状态，让用户轻松掌握网络活动情况。 软件下载：Radio…...
等级考试一级考试真题2023年9月——持续更新.....)
全国青少年软件编程(Python)等级考试一级考试真题2023年9月——持续更新.....
青少年软件编程（Python）等级考试试卷（一级） 分数：100 题数：37 一、单选题(共25题，共50分) 1.下列 Python 语句能够正确输出"学而时习之"五个字的是？（ ）A.print “学而时习之” B.print “(学而时习之)” C.print (“学而时习之”) D.print (学而时习之) 标…...
【网络】每天掌握一个Linux命令 - iftop
在Linux系统中，iftop是网络管理的得力助手，能实时监控网络流量、连接情况等，帮助排查网络异常。接下来从多方面详细介绍它。 目录 【网络】每天掌握一个Linux命令 - iftop工具概述安装方式核心功能基础用法进阶操作实战案例面试题场景生产场景…...
Vue记事本应用实现教程
文章目录 1. 项目介绍2. 开发环境准备3. 设计应用界面4. 创建Vue实例和数据模型5. 实现记事本功能5.1 添加新记事项5.2 删除记事项5.3 清空所有记事 6. 添加样式7. 功能扩展：显示创建时间8. 功能扩展：记事项搜索9. 完整代码10. Vue知识点解析10.1 数据绑…...
云计算——弹性云计算器（ECS）
弹性云服务器：ECS 概述 云计算重构了ICT系统，云计算平台厂商推出使得厂家能够主要关注应用管理而非平台管理的云平台，包含如下主要概念。 ECS（Elastic Cloud Server）：即弹性云服务器，是云计算…...
渲染学进阶内容——模型
最近在写模组的时候发现渲染器里面离不开模型的定义，在渲染的第二篇文章中简单的讲解了一下关于模型部分的内容，其实不管是方块还是方块实体，都离不开模型的内容 🧱 一、CubeListBuilder 功能解析 CubeListBuilder 是 Minecraft Java 版模型系统的核心构建器，用于动态创…...
Keil 中设置 STM32 Flash 和 RAM 地址详解
文章目录 Keil 中设置 STM32 Flash 和 RAM 地址详解一、Flash 和 RAM 配置界面（Target 选项卡）1. IROM1（用于配置 Flash）2. IRAM1（用于配置 RAM）二、链接器设置界面（Linker 选项卡）1. 勾选“Use Memory Layout from Target Dialog”2. 查看链接器参数（如果没有勾选上面…...
【单片机期末】单片机系统设计
主要内容：系统状态机，系统时基，系统需求分析，系统构建，系统状态流图 一、题目要求 二、绘制系统状态流图 题目：根据上述描述绘制系统状态流图，注明状态转移条件及方向。 三、利用定时器产生时…...
DBAPI如何优雅的获取单条数据
API如何优雅的获取单条数据 案例一 对于查询类API，查询的是单条数据，比如根据主键ID查询用户信息，sql如下： select id, name, age from user where id #{id}API默认返回的数据格式是多条的，如下： {&qu…...
【Zephyr 系列 10】实战项目：打造一个蓝牙传感器终端 + 网关系统（完整架构与全栈实现）
🧠关键词：Zephyr、BLE、终端、网关、广播、连接、传感器、数据采集、低功耗、系统集成 📌目标读者：希望基于 Zephyr 构建 BLE 系统架构、实现终端与网关协作、具备产品交付能力的开发者 📊篇幅字数：约 5200 字 ✨ 项目总览 在物联网实际项目中，**“终端 + 网关”**是…...
3-11单元格区域边界定位(End属性)学习笔记
返回一个Range 对象，只读。该对象代表包含源区域的区域上端下端左端右端的最后一个单元格。等同于按键 End 向上键(End(xlUp))、End向下键(End(xlDown))、End向左键(End(xlToLeft)End向右键(End(xlToRight)) 注意：它移动的位置必须是相连的有内容的单元格…...
python报错No module named ‘tensorflow.keras‘
是由于不同版本的tensorflow下的keras所在的路径不同，结合所安装的tensorflow的目录结构修改from语句即可。 原语句： from tensorflow.keras.layers import Conv1D, MaxPooling1D, LSTM, Dense 修改后： from tensorflow.python.keras.lay…...