知识点7--spring boot实现三层架构-修改、查询详情数据

尘世壹俗人

已于 2022-09-12 18:22:24 修改

阅读量848

点赞数

分类专栏： Spring boot 文章标签： spring boot 架构 java

于 2022-06-10 13:51:42 首次发布

本文链接：https://blog.csdn.net/dudadudadd/article/details/125219855

版权

Spring boot 专栏收录该内容

25 篇文章 16 订阅

订阅专栏

本文详细介绍了如何在SpringBoot项目中实现用户数据的修改和详情展示。通过配置修改链接、编写预修改和修改控制器，以及创建相应的前端页面，实现了用户信息的编辑与查看功能。同时，文章还展示了如何在列表页面展示部门名称，完善了数据展示的细节。

摘要由CSDN通过智能技术生成

本篇文章目标为，介绍spring boot的修改数据，项目代码沿用知识点6，同时大家要理清思路，新增和修改本质上用的是同一个页面，只是提交的东西不一样而已，详情页面本质上是修改页面不提供编辑功能

第一步：在列表页面，配置修改选项

<a href="/user/toEdit?id=${user.id?c}">修改</a>

第二步：编写对应的预修改控制器和修改控制器

@RequestMapping("/toEdit")
public String toEdit(HttpServletRequest request,Integer id){
    //查询要编辑用户信息
    User user = userService.getById(id);
    //存储
    request.setAttribute("user",user);
    //查询所有部门
    List<Dept> depts = deptService.list();
    request.setAttribute("depts",depts);
    return "user_edit";
}

@RequestMapping("/edit")
@ResponseBody
public boolean edit(User user){
    return userService.updateById(user);
}

第三步：编写修改用的页面，复制新增页面，改一改也行

<html>
<head>
    <title>欢迎进入user用户列表</title>
    <script type="text/javascript" src="/jquery-3.2.1.js"></script>
</head>
<body>
    <form id="editFrm">
        <input type="hidden" name="id" value="${user.id?c}"/>
        名称:<input type="text" name="name" value="${user.name!""}"/><br/>
        出生日期:<input type="date" name="brith" value='<#if user.brith??>${user.brith?string("yyyy-MM-dd")}</#if>'/><br/>
        所在部门:<select name="did">
            <option value="">请选择所在的部门</option>
            <#list depts as dept>
                <option <#if user.did??><#if user.did==dept.id>selected</#if></#if> value="${dept.id}">${dept.name}</option>
            </#list>
        </select><br/>
        邮箱:<input type="email" name="email" value="${user.email!""}"/><br/>
        <!--不能写<button></button> 不能写 type="submit"  采用ajax的写法-->
        <input type="button" onclick="updateObject()" value="编辑用户"/>
    </form>


    <script type="text/javascript">
        function updateObject(){
            $.post('/user/edit',$("#editFrm").serialize(),function(data){
                if(data){
                    alert("编辑成功")
                    window.location.href="/user/list";
                }else{
                    alert("编辑失败")
                }
            },"json");
        }
    </script>
</body>
</html>

最后测试效果即可
在这里插入图片描述

查询数据详情更简单

第一步：把预修改控制器复制改一改

@RequestMapping("/detail")
public String detail(HttpServletRequest request,Integer id){
    //查询要编辑用户信息
    User user = userService.getById(id);
    //判断外键是否为空
    if(user.getDid()!=null){
        //根据id查询
        Dept dept = deptService.getById(user.getDid());
        //设置部门名称
        user.setDname(dept.getName());
    }
    //存储
    request.setAttribute("user",user);
    return "/user_detail";
}

第二步：前端准备一个详情页

<html>
	<head>
	    <title>欢迎进入user用户列表</title>
	    <script type="text/javascript" src="/jquery-3.2.1.js"></script>
	</head>
	<body>
	    名称:${user.name!""}<br/>
	    出生日期:<#if user.brith??>${user.brith?string("yyyy-MM-dd")}</#if><br/>
	    所在部门:${user.dname!""}<br/>
	    邮箱:${user.email!""}<br/>
	    <a href="javascript:history.go(-1)">返回</a>
	</body>
</html>

第三步：修改前端详情按钮

<a href="/user/detail?id=${user.id?c}">详情</a>

最后看效果
在这里插入图片描述

到此一整套三层架构的添删改查就给大家串完了，最后完善一点，在列表界面并没有展示部门名称，这里完善一下，把列表控制器代码添加部门的查询

/**
 * 出列表
 * @param request
 * @param current
 * @param size
 * @param user
 * @return
 */
@RequestMapping("/list")
public String list(HttpServletRequest request, @RequestParam(defaultValue = "1") long current, @RequestParam(defaultValue = "3") long size, User user){
    //创建分页对象
    Page<User> page =new Page<>(current,size);
    //创建查询条件对象
    QueryWrapper<User> wrapper = new QueryWrapper<>();
    //spring boot将条件查询封装成了一个对象，可以使用
    if(user!=null){
        if(user.getName()!=null && !"".equals(user.getName().trim())){
            wrapper.like("name",user.getName());
        }
        if(user.getBrith()!=null){
            wrapper.eq("brith",user.getBrith());
        }
    }

    //执行分页查询
    IPage<User> pageInfo = userService.page(page, wrapper);

    //展示部门
    //当前页的记录数
    List<User> records = pageInfo.getRecords();
    //遍历当前页的记录数
    for(User entity:records){
        //判断外键是否为空
        if(entity.getDid()!=null){
            //根据id查询
            Dept dept = deptService.getById(entity.getDid());
            //设置部门名称
            entity.setDname(dept.getName());
        }
    }

    //单独存储总页数，最所以怎么做是因为现在市场上用的JDK和mybatis-plus版本有点不符合，总页数无法封装到前台
    request.setAttribute("pages",pageInfo.getPages());
    //存储到request中
    request.setAttribute("pageInfo",pageInfo);
    request.setAttribute("user",user);
    return "/user_list";
}

前端列表界面，table表格中展示部门名称，将下面两个标签放在合适的位置

<th>部门</th>
<td>${user.dname!""}</td>

这样就比较完善了
在这里插入图片描述
到此本篇知识点讲解结束，此外本次整体讲解的spring boot项目已上传github

尘世壹俗人

关注

0
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
知识点7--spring boot实现三层架构-修改、查询详情数据

本篇文章目标为，介绍spring boot的修改数据，项目代码沿用知识点6，同时大家要理清思路，新增和修改本质上用的是同一个页面，只是提交的东西不一样而已，详情页面本质上是修改页面不提供编辑功能...............
复制链接

扫一扫

专栏目录