本文档详细介绍了如何在MyBatis框架下，通过mapper映射和DAO操作实现用户详情的查询，并展示了如何在Servlet和JSP中整合，最终实现在Bootstrap风格的detail.jsp页面上动态展示用户信息。
该系列为imooc Java数据库开发与实战应用中MyBatis课程笔记，跟随课程加入自己见解，同时也为项目中碰到一些问题做了解答
实现查看用户详情的功能
大纲
一、新增mapper映射文件，查询配置
<select id="findById" resultType="com.damu.entity.Users">
select * from users where id =#{id}
</select>
二、完善UsersDAO
package com.damu.dao;
import com.damu.entity.Users;
import com.damu.utils.SqlSessionFactoryUtils;
import org.apache.ibatis.session.SqlSession;
import java.util.List;
/**
* Created by mouwe on 2017/5/23.
*/
public class UsersDAO {
private SqlSession sqlSession=SqlSessionFactoryUtils.getSqlSessionFactory().openSession();
private List<Users> list;
private Users user;
/**
* 查询全部用户
* @return
*/
public List<Users> findAll() {
try {
list = sqlSession.selectList("findAll");
} catch (Exception e) {
e.printStackTrace();
} finally {
sqlSession.close();
}
return list;
}
/**
* 根据编号查询单个用户
* @return
*/
public Users findById(Integer id) {
try {
user=sqlSession.selectOne("findById",id);
} catch (Exception e) {
e.printStackTrace();
} finally {
sqlSession.close();
}
return user;
}
}
三、UsersDAO中的数据，我们通过Servlet进行调用
package com.damu.servlet;
import com.damu.dao.UsersDAO;
import com.damu.entity.Users;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
@WebServlet("/detail")
public class UsersFindByIdServlet extends HttpServlet {
private UsersDAO usersDAO=new UsersDAO();
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
this.doPost(req, resp);
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String id =req.getParameter("id");
Users user=usersDAO.findById(Integer.parseInt(id));
req.setAttribute("user",user);
req.getRequestDispatcher("detail.jsp").forward(req,resp);//请求转发至detail.jsp
}
}
那么detail.jsp路径是从哪里进行访问的呢？
四、在index.jsp中完善detail.jsp的访问路径
<a href="${pageContext.request.contextPath}/detail?id=${user.id}">查看</a>
五、编写detail.jsp页面
- webapp>新建detail.jsp
- detail.jsp同样适用bootstrap布局c
- 在detail.jsp中使用bootstrap巨幕组件（组件代码地址https://v3.bootcss.com/components/#jumbotron）
组件代码
<link rel="stylesheet" href="lib/bootstrap-3.3.7-dist/css/bootstrap.min.css">
<script src="lib/2.2.4/jquery-1.12.4.min.js"></script>
<script src="lib/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<div class="jumbotron">
<h1>Hello, world!</h1>
<p>...</p>
<p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a></p>
</div>
直接参照index.jsp，复制进detail.jsp
<%--
Created by IntelliJ IDEA.
User: 35208
Date: 2021/4/7
Time: 0:58
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>慕课网用户管理中心</title>
<link rel="stylesheet" href="lib/bootstrap-3.3.7-dist/css/bootstrap.min.css">
<script src="lib/2.2.4/jquery-1.12.4.min.js"></script>
<script src="lib/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="page-header">
<h1>慕课网管理后台<small>用户数据管理中心</small></h1>
</div>
</div>
<div class="row">
<div class="jumbotron">
<h1>MyBstis基础入门课程</h1>
<p>通过一个项目来完成基础部分学习</p>
<p><a class="btn btn-primary btn-lg" href="#" role="button">查看更多，请上慕课网</a></p>
</div>
</div>
</div>>
</body>
</html>
- 完善用户详情字段展示（使用表单展示），查看bootstrap官方样式文档，查找表单类型，选择使用静态表单
<form class="form-horizontal">
<div class="form-group">
<label class="col-sm-2 control-label">Email</label>
<div class="col-sm-10">
<p class="form-control-static">email@example.com</p>
</div>
</div>
<div class="form-group">
<label for="inputPassword" class="col-sm-2 control-label">Password</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="inputPassword" placeholder="Password">
</div>
</div>
</form>
- 完善detail.jsp用户详情中字段在表单中的显示，不需要修改的字段写成静态的，需要修改的字段写成动态的
静态字段举例
<div class="form-group">
<label class="col-sm-2 control-label">用户账号</label>
<div class="col-sm-10">
<p class="form-control-static">${user.username}</p>
</div>
</div>
动态字段举例
<div class="form-group">
<label for="nickname" class="col-sm-2 control-label">昵称</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="nickname" value="${user.nickname}" name="nickname" placeholder="Password">
</div>
</div>
使用jstl标签获取动态数据，添加引入jstl标签语句
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
使用jstl读取ruquest保存的用户数据
<c:set var="user" value="${user}"></c:set>
使用jstl格式化标签完善时间显示问题
引入jstl格式化标签
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
使用jstl格式化标签输出时间数据
<fmt:formatDate value="${user.createTime}" pattern="yyyy-MM-dd"></fmt:formatDate>
完善detail.jsp中字段的数据显示
全部代码如下
<%--
Created by IntelliJ IDEA.
User: 35208
Date: 2021/4/7
Time: 0:58
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
<title>慕课网用户管理中心</title>
<link rel="stylesheet" href="lib/bootstrap-3.3.7-dist/css/bootstrap.min.css">
<script src="lib/2.2.4/jquery-1.12.4.min.js"></script>
<script src="lib/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="page-header">
<h1>慕课网管理后台<small>用户数据管理中心</small></h1>
</div>
</div>
<div class="row">
<div class="jumbotron">
<h1>MyBstis基础入门课程</h1>
<p>通过一个项目来完成基础部分学习</p>
<p><a class="btn btn-primary btn-lg" href="#" role="button">查看更多，请上慕课网</a></p>
</div>
</div>
<c:set var="user" value="${user}"></c:set>
<div class="row">
<div class="col-md-8 col-md-offset-2">
<form class="form-horizontal">
<div class="form-group">
<label class="col-sm-2 control-label">用户账号</label>
<div class="col-sm-10">
<p class="form-control-static">${user.username}</p>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">登录密码</label>
<div class="col-sm-10">
<p class="form-control-static">******</p>
</div>
</div>
<div class="form-group">
<label for="nickname" class="col-sm-2 control-label">昵称</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="nickname" value="${user.nickname}" name="nickname" placeholder="请输入昵称">
</div>
</div>
<div class="form-group">
<label for="age" class="col-sm-2 control-label">年龄</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="age" value="${user.age}" name="age" placeholder="请输入年龄">
</div>
</div>
<div class="form-group">
<label for="gender" class="col-sm-2 control-label">性别</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="gender" value="${user.gender}" name="gender" placeholder="请输入性别">
</div>
</div>
<div class="form-group">
<label for="phone" class="col-sm-2 control-label">联系方式</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="phone" value="${user.phone}" name="phone" placeholder="请输入联系方式">
</div>
</div>
<div class="form-group">
<label for="email" class="col-sm-2 control-label">邮箱</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="email" value="${user.email}" name="email" placeholder="请输入邮箱">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">账号创建时间</label>
<div class="col-sm-10">
<p class="form-control-static">
<fmt:formatDate value="${user.createTime}" pattern="yyyy-MM-dd"></fmt:formatDate>
</p>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">最后修改时间</label>
<div class="col-sm-10">
<p class="form-control-static">
<fmt:formatDate value="${user.updateTime}" pattern="yyyy-MM-dd"></fmt:formatDate>
</p>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">最后登录时间</label>
<div class="col-sm-10">
<p class="form-control-static">
<fmt:formatDate value="${user.lastLogTime}" pattern="yyyy-MM-dd"></fmt:formatDate>
</p>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">用户状态</label>
<div class="col-sm-10">
<c:if test="${user.userStatus == 0}">
<td>正常</td>
</c:if>
<c:if test="${user.userStatus == 1}">
<td>锁定</td>
</c:if>
<c:if test="${user.userStatus == 2}">
<td>删除</td>
</c:if>
</div>
</div>
<div class="form-group">
<label for="remark" class="col-sm-2 control-label">备注</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="remark" value="${user.remark}" name="remark" placeholder="请输入备注">
</div>
</div>
</form>
</div>
</div>
</div>
</body>
</html>
启动项目
发现问题：所有用户详情页中都是第一条用户的数据，
观察控制台出现的错误
Executor是SQL执行器，它关闭了意味着SqlSession关闭了，打开UsersDAO观察
当我们创建一个UsersDAO对象时，获取了一个SqlSession对象，但是SqlSession对象只有在UsersDAO对象创建时创建一次！当关闭了SqlSession，后面再去使用UsersDAO里面的SqlSession就使用不了了
解决完善UsersDAO
package com.damu.dao;
import com.damu.entity.Users;
import com.damu.utils.SqlSessionFactoryUtils;
import org.apache.ibatis.session.SqlSession;
import java.util.List;
/**
* Created by mouwe on 2017/5/23.
*/
public class UsersDAO {
private SqlSession sqlSession;
private List<Users> list;
private Users user;
private SqlSession getSqlSession(){
sqlSession=SqlSessionFactoryUtils.getSqlSessionFactory().openSession();
return sqlSession;
}
/**
* 查询全部用户
* @return
*/
public List<Users> findAll() {
try {
list = getSqlSession().selectList("findAll");
} catch (Exception e) {
e.printStackTrace();
} finally {
sqlSession.close();
}
return list;
}
/**
* 根据编号查询单个用户
* @return
*/
public Users findById(Integer id) {
try {
user=getSqlSession().selectOne("findById",id);
} catch (Exception e) {
e.printStackTrace();
} finally {
sqlSession.close();
}
return user;
}
}
再次启动项目，即可正常查询每个用户的详情页
扫一扫
512
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
