Spring boot+mybatis+thymeleaf 實現登錄注冊增刪改查功能的示例代碼
本文重在實現理解,過濾器,業務,邏輯需求,樣式請無視。。
項目結構如下
1.idea新建Spring boot項目,在pom中加上thymeleaf和mybatis支持。pom.xml代碼如下
<?xml version='1.0' encoding='UTF-8'?><project xmlns='http://maven.apache.org/POM/4.0.0' xmlns:xsi='http://www.w3.org/2001/XMLSchema-instance' xsi:schemaLocation='http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd'> <modelVersion>4.0.0</modelVersion> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>2.1.3.RELEASE</version> <relativePath/> <!-- lookup parent from repository --> </parent> <groupId>com.jz</groupId> <artifactId>table</artifactId> <version>0.0.1-SNAPSHOT</version> <name>table</name> <description>Demo project for Spring Boot</description> <properties> <java.version>1.8</java.version> </properties> <dependencies> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-test</artifactId> <scope>test</scope> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> <dependency> <groupId>org.mybatis.spring.boot</groupId> <artifactId>mybatis-spring-boot-starter</artifactId> <version>1.3.1</version> </dependency> <dependency> <groupId>mysql</groupId> <artifactId>mysql-connector-java</artifactId> <scope>runtime</scope> </dependency> </dependencies> <build> <plugins> <plugin> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-maven-plugin</artifactId> </plugin> </plugins> </build></project>
2. 在項目resources目錄下新建mybatis文件夾,用于存放mybatis配置文件。 在 application.properties 中配置本地數據源和mybatis配置文件地址, application.properties代碼如下
spring.datasource.driverClassName=com.mysql.cj.jdbc.Driverspring.datasource.url=jdbc:mysql://localhost:3306/student?useUnicode=true&characterEncoding=utf-8&useSSL=false&serverTimezone=UTCspring.datasource.username=用戶名spring.datasource.password=密碼spring.jpa.showSql=truemybatis: mybatis.type-aliases-package=com.jz.table.entity mybatis.mapper-locations=mybatis/*.xml
com.mysql.cj.jdbc.Driver 是 mysql-connector-java 6中的,需要指定時區serverTimezone
2.2在啟動類上加上掃描的Dao包
package com.jz.table;import org.mybatis.spring.annotation.MapperScan;import org.springframework.boot.SpringApplication;import org.springframework.boot.autoconfigure.SpringBootApplication;@SpringBootApplication@MapperScan('com.jz.table.dao')public class TableApplication { public static void main(String[] args) { SpringApplication.run(TableApplication.class, args); }}
3.數據庫建兩個表admin和userinfo用于登錄和操作用
2019.10.3 現在mysql不能用admin作為表名了,請注意一下
4.開始寫代碼
entity:實體代碼
1.Admin實體類
package com.jz.table.entity;public class Admin { private Integer id; private String name; private Integer password; private String job; public Admin() { } public Admin(Integer id, String name, Integer password, String job) { this.id = id; this.name = name; this.password = password; this.job = job; } public Integer getId() { return id; } public void setId(Integer id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } public Integer getPassword() { return password; } public void setPassword(Integer password) { this.password = password; } public String getJob() { return job; } public void setJob(String job) { this.job = job; }}
2.UserInfo實體類
package com.jz.table.entity;public class UserInfo { private Integer id; private String name; private Integer age; private String sex; public UserInfo() { } public UserInfo(Integer id, String name, Integer age, String sex) { this.id = id; this.name = name; this.age = age; this.sex = sex; } public Integer getId() { return id; } public void setId(Integer id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } public Integer getAge() { return age; } public void setAge(Integer age) { this.age = age; } public String getSex() { return sex; } public void setSex(String sex) { this.sex = sex; }}
Dao層代碼1.AdminDao
package com.jz.table.dao;import com.jz.table.entity.Admin;public interface AdminDao { //登錄判斷 Admin login(Admin admin); //注冊 int addAdmin(Admin admin);}
2.UserDao
package com.jz.table.dao;import com.jz.table.entity.UserInfo;import java.util.List;public interface UserDao { //查 List<UserInfo> findall(); //增 int adduser(UserInfo user); //根據Id查,用于修改時頁面回顯數據 UserInfo findByid(Integer id); //修改 int updateUser(UserInfo user); //刪除 int delUser(Integer id);}
3.XML文件,因為沒有業務邏輯,service省了,controller中直接引入dao1.AdminMapper.xml
<?xml version='1.0' encoding='UTF-8' ?><!DOCTYPE mapper PUBLIC '-//mybatis.org//DTD Mapper 3.0//EN' 'http://mybatis.org/dtd/mybatis-3-mapper.dtd' ><mapper namespace='com.jz.table.dao.AdminDao'> <select parameterType='com.jz.table.entity.Admin' resultType='com.jz.table.entity.Admin'> select name,job FROM admin WHERE name = #{name} AND password = #{password} </select> <insert parameterType='com.jz.table.entity.Admin'> INSERT INTO admin (name,password,job) VALUES (#{name},#{password},#{job}); </insert></mapper>
2.UserMapper.xml
<?xml version='1.0' encoding='UTF-8' ?><!DOCTYPE mapper PUBLIC '-//mybatis.org//DTD Mapper 3.0//EN' 'http://mybatis.org/dtd/mybatis-3-mapper.dtd' ><mapper namespace='com.jz.table.dao.UserDao'> <select resultType='com.jz.table.entity.UserInfo'> select * from userinfo </select> <insert parameterType='com.jz.table.entity.UserInfo'> INSERT INTO userinfo(name,age,sex) VALUES (#{name},#{age},#{sex}) </insert> <select parameterType='java.lang.Integer' resultType='com.jz.table.entity.UserInfo'> SELECT * FROM userinfo where id = #{id} </select> <update parameterType='com.jz.table.entity.UserInfo'> update userinfo SET name=#{name },age =#{age},sex=#{sex} WHERE id = #{id} </update> <delete parameterType='java.lang.Integer'> DELETE from userinfo WHERE id = #{id} </delete></mapper>
4.頁面,在templates文件夾下新建public和user文件夾用來存放公共頁面和user操作頁面public文件夾下新建成功、失敗提示頁1.success.html
<!DOCTYPE html><!--引入thymeleaf--><html lang='en' xmlns:th='http://www.thymeleaf.org'> <head> <meta charset='UTF-8'> <title>操作成功提示頁</title></head><body><h1>操作成功</h1><a href='http://www.aoyou183.cn/index' rel='external nofollow' rel='external nofollow' > 返回首頁</a></body></html>
2.false.html
<!DOCTYPE html><html lang='en' xmlns:th='http://www.thymeleaf.org'><head> <meta charset='UTF-8'> <title>操作失敗提示頁</title> <script th:src='http://www.aoyou183.cn/bcjs/@{/js/jquery-1.8.0.min.js}'></script></head><body><h1>操作失敗,請檢查數據重試</h1><input onclick='history.go(-1)' type='button' value='返回'></body></html>
4.2在templates文件夾下新建login和register頁面作為登錄和注冊頁面1.login.html
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>首頁</title> <style> /*a標簽去下劃線和點擊不變色,div內容居中*/ a{ text-decoration: none; color: #333333; } #idiv{text-align: center;border-radius: 20px; width: 300px; height: 350px; margin: auto; position: absolute; top: 0; left: 0; right: 0; bottom: 0;} </style></head><body><div id='idiv'> <form action='/gologin' method='post'> 請輸入姓名<input name='name' required='required'><br><br> 請輸入密碼<input name='password' type='password' placeholder='僅支持正整數' required='required'><br><br> <input type='submit' value='登錄'> <button> <a href='http://www.aoyou183.cn/goregister' rel='external nofollow' >注冊</a></button> </form></div></body></html>
2.register.html
<!DOCTYPE html><html lang='en' xmlns:th='http://www.thymeleaf.org'><head> <meta charset='UTF-8'> <title>賬號注冊</title> <script th:src='http://www.aoyou183.cn/bcjs/@{/js/jquery-1.8.0.min.js}'></script></head><body><h2>賬號注冊</h2>請輸入姓名:<input type='text' /><br><br>請輸入密碼:<input type='password' placeholder='僅支持整數' /><br><br>請確認密碼:<input type='password' placeholder='僅支持整數'/><br><br>請選擇角色:<select style='width: 173px'> <option value='管理員'>管理員</option> </select><br><br><button onclick='register()'>注冊</button></body><script> function register() { var name = $('#name').val(); var password1 = $('#password').val(); var password2 = $('#passwordTwo').val(); var job = $('#job').val(); if (Number(password1) == Number(password2)){ $.post('/register',{name:name,password:password1,job:job},function (res) { if (res ==true){ alert('注冊成功'); window.location.href ='http://www.aoyou183.cn/login'; } else { alert('注冊失敗,請檢查數據重試'); } }) }else { alert('兩次密碼不一致!'); } }</script></html>
3.controller中代碼
@Controllerpublic class TestController { @Resource private AdminDao ad; @Resource private UserDao ud; @RequestMapping('/login')//主頁 public String index(){ return 'login'; } @RequestMapping('/goregister')//去注冊頁面 public String goregister(){ return 'register'; } @RequestMapping('/register')//注冊 @ResponseBody public boolean register(Admin admin){ int i = ad.addAdmin(admin); if (i>0){ return true; }else { return false; } } @RequestMapping('/gologin')//登錄獲取用戶信息存到seccion public String gologin(Admin admin,HttpServletRequest request,Model model){ Admin aa = ad.login(admin); if (aa==null){ return 'public/false'; } HttpSession session = request.getSession(); session.setAttribute('aname',admin.getName()); session.setAttribute('apassword',admin.getPassword()); List<UserInfo> userlist = ud.findall(); model.addAttribute('admin',aa); model.addAttribute('alist',userlist); return 'user/index'; } @RequestMapping('/index')//從其他頁面操作后返回列表頁面(重復登錄) public String login(Admin admin,Model model,HttpServletRequest request){ HttpSession session = request.getSession(); admin.setName((String) session.getAttribute('aname')); admin.setPassword((Integer) session.getAttribute('apassword')); Admin aa = ad.login(admin); List<UserInfo> userlist = ud.findall(); model.addAttribute('admin',aa); model.addAttribute('alist',userlist); return 'user/index'; }}
4.3user文件夾下新建index,addUser,updateUser頁面,作為主頁,添加,修改頁面
1.index.html
<!DOCTYPE html><html lang='en' xmlns:th='http://www.thymeleaf.org'><head> <meta charset='UTF-8'> <title>首頁</title> <style>a{text-decoration:none}</style> <script th:src='http://www.aoyou183.cn/bcjs/@{/js/jquery-1.8.0.min.js}'></script></head><body>歡迎你 :<input th:value='${admin.name}' /><br><br><br><br><h2>人員信息維護</h2><table border='1'> <thead> <tr> <th>id</th> <th>姓名</th> <th>年齡</th> <th>性別</th> <th>操作</th> </tr> <tr th:each='user:${alist}'> <td th:text='${user.id}'></td> <td th:text='${user.name}'></td> <td th:text='${user.age}'></td> <td th:text='${user.sex}'></td> <td align='center'><a th:href='http://www.aoyou183.cn/bcjs/@{’/goupdate/’+${user.id}}' rel='external nofollow' >修改</a> <a th:href='http://www.aoyou183.cn/bcjs/@{’/godel/’+${user.id}}' rel='external nofollow' >刪除</a> </td> </tr> </thead></table><button><a href='http://www.aoyou183.cn/goadd' rel='external nofollow' >添加</a></button></body></html>
2.addUser.html
<!DOCTYPE html><html lang='en' xmlns:th='http://www.thymeleaf.org'><head> <meta charset='UTF-8'> <title>添加用戶</title> <script th:src='http://www.aoyou183.cn/bcjs/@{/js/jquery-1.8.0.min.js}'></script></head><body><h2>我是添加頁面</h2>請輸入姓名:<input name='name' type='text' /><br><br>請輸入年齡:<input name='age' type='text' /><br><br>請選擇性別:<select name='sex' style='width: 173px'> <option value='男'>男</option> <option value='女'>女</option> </select><br><br><button onclick='goadd()' name='sub' id='sub'>添加</button><button name='button' onclick='javascript:history.back(-1);'>返回</button></body><script> function goadd() { var name = $('#name').val(); var age = $('#age').val(); var sex = $('#sex').val(); $.post('/addUser',{name:name,age:age,sex:sex},function (res) { if (res==true){ alert('添加成功') window.location.href ='http://www.aoyou183.cn/index'; }else { alert('添加失敗,請檢查數據重試!'); } }) }</script></html>
3.updateUser.html
<!DOCTYPE html><html lang='en' xmlns:th='http://www.thymeleaf.org'><head> <meta charset='UTF-8'> <title>修改用戶</title> <script th:src='http://www.aoyou183.cn/bcjs/@{/js/jquery-1.8.0.min.js}'></script></head><body><h2>這是修改頁面</h2><input type='hidden' th:value='${user.id}'><br><br>請輸入姓名:<input th:value='${user.name}'/><br><br>請輸入年齡:<input th:value='${user.age}'/><br><br>請選擇性別:<select style='width: 173px'> <option value='男'>男</option> <option value='女'>女</option> </select><br><br><button onclick='goupdate()'>修改</button> <button name='button' onclick='javascript:history.back(-1);'>返回</button></body><script> function goupdate() { var id=$('#id').val(); var name = $('#name').val(); var age = $('#age').val(); var sex = $('#sex').val(); $.post('/update',{id:id,name:name,age:age,sex:sex},function (res) { if (res==true) { alert('修改成功'); window.location.href='http://www.aoyou183.cn/index' rel='external nofollow' rel='external nofollow' ; }else { alert('修改失敗,請檢查數據重試!'); } }) }</script></html>
4.controller中代碼
@RequestMapping('/goadd')//去添加頁面public String goadd(){ return 'user/addUser';}@RequestMapping('/addUser')//添加信息@ResponseBodypublic boolean addUser(UserInfo user){ int i = ud.adduser(user); if (i>0){ return true; }else { return false; }}@RequestMapping('/goupdate/{id}')//去修改頁面,回顯數據public String goupdate(@PathVariable('id') int id,Model model){ UserInfo user = ud.findByid(id); model.addAttribute('user',user); return 'user/updateUser';}@RequestMapping('/update')//修改@ResponseBodypublic boolean updateUser(UserInfo user){ int i = ud.updateUser(user); if (i>0){ return true; }else { return false; }}@RequestMapping('/godel/{id}')//刪除public String delUser(@PathVariable('id') Integer id){ ud.delUser(id); return 'public/success';}
5.完整controller代碼
package com.jz.table.controller;import com.jz.table.dao.AdminDao;import com.jz.table.dao.UserDao;import com.jz.table.entity.Admin;import com.jz.table.entity.UserInfo;import org.springframework.stereotype.Controller;import org.springframework.ui.Model;import org.springframework.web.bind.annotation.PathVariable;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.ResponseBody;import javax.annotation.Resource;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpSession;import java.util.List;@Controllerpublic class TestController { @Resource private AdminDao ad; @Resource private UserDao ud; @RequestMapping('/login')//主頁 public String index(){ return 'login'; } @RequestMapping('/goregister')//去注冊頁面 public String goregister(){ return 'register'; } @RequestMapping('/register')//注冊 @ResponseBody public boolean register(Admin admin){ int i = ad.addAdmin(admin); if (i>0){ return true; }else { return false; } } @RequestMapping('/gologin')//登錄獲取用戶信息存到seccion public String gologin(Admin admin,HttpServletRequest request,Model model){ Admin aa = ad.login(admin); if (aa==null){ return 'public/false'; } HttpSession session = request.getSession(); session.setAttribute('aname',admin.getName()); session.setAttribute('apassword',admin.getPassword()); List<UserInfo> userlist = ud.findall(); model.addAttribute('admin',aa); model.addAttribute('alist',userlist); return 'user/index'; } @RequestMapping('/index')//從其他頁面操作后返回列表頁面(重復登錄) public String login(Admin admin,Model model,HttpServletRequest request){ HttpSession session = request.getSession(); admin.setName((String) session.getAttribute('aname')); admin.setPassword((Integer) session.getAttribute('apassword')); Admin aa = ad.login(admin); List<UserInfo> userlist = ud.findall(); model.addAttribute('admin',aa); model.addAttribute('alist',userlist); return 'user/index'; } @RequestMapping('/goadd')//去添加頁面 public String goadd(){ return 'user/addUser'; } @RequestMapping('/addUser')//添加信息 @ResponseBody public boolean addUser(UserInfo user){ int i = ud.adduser(user); if (i>0){ return true; }else { return false; } } @RequestMapping('/goupdate/{id}')//去修改頁面,回顯數據 public String goupdate(@PathVariable('id') int id,Model model){ UserInfo user = ud.findByid(id); model.addAttribute('user',user); return 'user/updateUser'; } @RequestMapping('/update')//修改 @ResponseBody public boolean updateUser(UserInfo user){ int i = ud.updateUser(user); if (i>0){ return true; }else { return false; } } @RequestMapping('/godel/{id}')//刪除 public String delUser(@PathVariable('id') Integer id){ ud.delUser(id); return 'public/success'; } }
效果如圖
到此這篇關于Spring boot+mybatis+thymeleaf 實現登錄注冊增刪改查功能的示例代碼的文章就介紹到這了,更多相關Spring boot mybatis thymeleaf 登錄注冊增刪改查內容請搜索好吧啦網以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持好吧啦網!
相關文章:
