赞
踩
实现数据的增删改查
向送外卖一样理解
1、准备食材(java bean)
2、菜谱(pojo接口->预制->sql 语句)
3、service处理
4、controller 派送
5、用户请求->页面
先写一个接口:
为xml的增加insert语句
resultType(有返回值的)
parameterType(没有返回值,参数的)
Controller写路由(地址)
必须输入添加的数据,用户交互没有添加功能,添加功能就是用户输入用户名和密码,这个功能只与Controller有关系,与数据库无关。这里增加一个显示页面的方法
有了地址后,添加addpage页面
用户不能输入id,只能输入username,password
修改sql的代码如下.
最后得到前端的页面代码
前端页面代码中的input属性必须有name属性,不然后端接收不到,并且名称与java bean的名称一致。
清楚访问地址
http://localhost:8080/user/addpage
提交后:添加到数据库的用户列表页
注册后,得到用户列表页
1、准备食材(java bean)
2、菜谱(pojo接口->预->sql 语句)
3、service处理
4、controller 派送
5、用户请求->页面
在逻辑中,删除结束后返回原来的用户列表页.
一般删除发生在用户列表页,删除某项就击“删除”键
前端页面首先在列表中有删除按钮
得到的页面
删除之前需要确认,确认后删除,需要前端做确认代码。
得到前端代码.
在Mapper中加入更新方法
界面,用户操作明白
修改逻辑一般
在前端击修改后先把原始数据放在页面中显示,然后根据需求去
改。
先把修改按钮放在页面上
需求中出现原始数据的显示地址,地址是Controller的事情.
到Controller后,发现还需要显示需要修改的原始数据。
这里需要调用Service的逻辑, Service就调用Mapper,Mapper 实现sql语句,Mapper功能按 修改的id找原始数据.
决定Mapper中多加一人方法
Mapper文件发生改变,Mapper的xml发生改变
完成Mapper,写Service,Service逻辑与Mapper类似,需要代码实现。
完成Serivce后,就可以写Controller调用
最后是前端,需要创建一个updatepage的页面
最后调整用户列表页
注释:
上面页面widow.location.href少一个h
效果如下
更新页面
addpage.html
- <!DOCTYPE html>
- <html lang="en" xmlns="http://www.w3.org/1999/html">
- <head>
- <meta charset="UTF-8">
- <title>添加用户</title>
- </head>
- <body>
- <!--action 是提交地址,决定有哪个逻辑来进行处理-->
- <!--用户是不可以输入id的,所以修改xml-->
- <form action="/user/add" method="post">
- 用户名:<input type="text" name="username"/></br>
- 密码:<input type="password" name="password"/></br>
- <button type="submit">注册</button>
-
- </form>
- </body>
- </html>
myuser.html
- <!DOCTYPE html>
- <html xmlns:th="http://www.thymeleaf.org">
- <head>
- <meta charset="UTF-8">
- <title>显示用户</title>
- </head>
- <body>
- <table>
- <tr>
- <td>id</td>
- <td>用户名</td>
- <td>用户密码</td>
- <td>操作</td>
- </tr>
- <tr th:each="item:${myusers}">
- <td th:text="${item.id}"></td>
- <td th:text="${item.username}"></td>
- <td th:text="${item.password}"></td>
- <td>
- <button type="button" th:onclick="|ondel(${item.id})|" >删除</button>
- <button type="button" th:onclick="|onupdate(${item.id})|">修改</button>
- </td>
- </tr>
- </table>
- <script>
- function onupdate(id){
- //修改不需要跳转,显示原始信息
- window.location.href="/user/orign?id="+id;
- }
-
- function ondel(id){
- //先确认是否删除
- answer=confirm("是否需要执行删除操作?")
- if(answer==true){
- // 地址栏地址
- window.location.href="/user/del?id="+id;
- }
- }
- </script>
-
- </body>
- </html>
updatepage.html
- <!DOCTYPE html>
- <html lang="en" xmlns:th="http://www.thymeleaf.org" >
- <head>
- <meta charset="UTF-8">
- <title>更新页面</title>
- </head>
- <body>
- <form action="/user/update" method="post">
- <input type="hidden" th:value="${oneuser.id}" name="id"/>
- 用户名:<input type="text" th:value="${oneuser.username}" name="username"/><br/>
- 密码:<input type="password" th:value="${oneuser.password}" name="password" /><br/>
- <button type="submit">更新</button>
- </form>
- </body>
- </html>
controller>UserController
- package com.controller;
-
- import com.bean.MyUser;
- import com.service.UserService;
- import org.springframework.beans.factory.annotation.Autowired;
- import org.springframework.stereotype.Controller;
- import org.springframework.ui.Model;
- import org.springframework.web.bind.annotation.RequestMapping;
-
- import java.util.ArrayList;
- import java.util.List;
-
- @Controller
- @RequestMapping("/user")
- public class UserController {
- @Autowired
- private UserService userservice;
- @RequestMapping("/list")
- public String ListUser(Model model) {
- List<MyUser> users = userservice.selectUser();
- System.out.println("users");
- model.addAttribute("myusers", users);
- return "myuser";
- }
-
-
- //指定地址添加requstmapping,方法最终返回页面,需要字符串,代表页面名称
- //处理用户的添加,参数还需要用户输入
- @RequestMapping("/add")
- public String addUser(MyUser user){
- userservice.addUser(user);
- //把数据添加成功之后,需要查看数据是否添加成功,返回查看页面,返回到list显示的页面
- //list地址逻辑已完成,没有必要再写
- return "forward:/user/list";
- }
- //给用户输入数据的页面,再给一个请求地址,专门显示页面的,与数据库无关
- @RequestMapping("/addpage")
- public String addpage(){
- return "addpage";
- }
-
- // 删除方法的路由
- @RequestMapping("/del")
- public String deleteUser(int id){
- userservice.deleteUser(id);
- // 操作后返回查询页面
- return "forward:/user/list";
- }
-
- //修改用户表的路由
- @RequestMapping("/update")
- public String updateUser(MyUser user){
- userservice.updateUser(user);
- return "forward:/user/list";
- }
-
- @RequestMapping("/orign")
- public String showUser(int id,Model model) {
- MyUser myuser = userservice.selectUserById(id);
- model.addAttribute("oneuser",myuser);
- return "updatepage";
- }
-
- }
pojo>UserMapper
- package com.pojo;
-
- import com.bean.MyUser;
- import org.apache.ibatis.annotations.Mapper;
- import java.util.List;
-
- @Mapper
- public interface UserMapper {
- public List<MyUser> selectUser();
-
- public void addUser(MyUser user);
-
- public void deleteUser(int id);
-
- public void updateUser(MyUser user);
-
- public MyUser selectUserById(int id);
- }
service>userservice
- package com.service;
-
- import com.bean.MyUser;
- import com.pojo.UserMapper;
- import org.springframework.beans.factory.annotation.Autowired;
- import org.springframework.stereotype.Service;
-
- import java.util.List;
-
- @Service
- public class UserService {
- @Autowired
- private UserMapper usermapper;
- public List<MyUser> selectUser(){
- return usermapper.selectUser();
- }
- public void addUser(MyUser user){
- //有返回值加return,没有返回值直接调用
- usermapper.addUser(user);
- }
-
- public void deleteUser(int id){
- // service中直接调用mapper方法
- usermapper.deleteUser(id);
- }
-
- public void updateUser(MyUser user){
- usermapper.updateUser(user);
- }
-
- public MyUser selectUserById(int id){
- return usermapper.selectUserById(id);
- }
-
- }
mybatis>UserMapper
- <?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.pojo.UserMapper">
- <select id="selectUser" resultType="com.bean.MyUser">
- select * from myuser
- </select>
-
- <insert id="addUser" parameterType="com.bean.MyUser">
- insert into myuser(username,password) values (#{username},#{password})
- </insert>
-
- <!--这里的参数只有id值,直接在模板使用id值-->
- <delete id="deleteUser" parameterType="int">
- delete from myuser where id=#{id}
- </delete>
-
- <update id="updateUser" parameterType="com.bean.MyUser">
- update myuser set username=#{username},password=#{password} where id=#{id}
- </update>
-
- <select id="selectUserById" parameterType="int" resultType="com.bean.MyUser">
- select * from myuser where id=#{id}
- </select>
-
-
-
- </mapper>
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。