使用三层架构思想的简单CRUD案例
1. 综合练习
简单功能
* 使用三层架构的思想
1. 浏览器访问web层(servlet)
2. web层调用业务层(service)的方法
3. 业务层调用持久层(userdao)的方法完成业务
4. web层回写数据给jsp，然后把页面响应给浏览器
* 注意参数的编码问题
在tomcat8版本之后，get方式的不会乱码，但是post方式的参数要设置编码
request.setCharacterEncoding("utf-8");
（这里调用service后，service都会调用dao中的方法，分析省略了此步骤）
1. 列表查询
*思路
1. 浏览器访问 userlistServlet
2. 调用service层的findAll()方法返回List<User>集合
3. 将list存放到request域中，转发给list.jsp进行页面的显示(el+jstl)
*userlistServlet
import com.qin.domain.User;
import com.qin.service.UserService;
import com.qin.service.impl.UserServiceImpl;
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;
import java.util.List;
@WebServlet("/userListServlet")
public class UserListServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//调用service接口的实现类中的findAll方法
UserService userService = new UserServiceImpl();
List<User> users = userService.findAll();
//将List存放在request域中,并转发
request.setAttribute("users",users);
request.getRequestDispatcher("/list.jsp").forward(request,response);
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);
}
}
* UserServiceImpl
@Override
public List<User> findAll() {
return dao.findAll();
}
* UserDaoImpl
@Override
public List<User> findAll() {
//定义sql语句
String sql = "select * from user";
List<User> users = template.query(sql, new BeanPropertyRowMapper<>(User.class));
return users;
}
2. 添加
*思路
1. 浏览器访问 add.jsp并将数据提交到 addUserServlet
2. 获取所有的参数，封装成为对象
3. 调用service层的add()方法完成保存
4. 跳转到userlistServlet转发至list.jsp进行页面的显示(el+jstl)
* 代码实现
* servlet
import com.qin.domain.User;
import com.qin.service.UserService;
import com.qin.service.impl.UserServiceImpl;
import org.apache.commons.beanutils.BeanUtils;
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;
import java.lang.reflect.InvocationTargetException;
import java.util.Map;
@WebServlet("/addUserServlet")
public class AddUserServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//设置页面的编码
request.setCharacterEncoding("utf-8");
//获取传递的参数,封装成为对象
Map<String, String[]> parameterMap = request.getParameterMap();
User user = new User();
try {
BeanUtils.populate(user,parameterMap);
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (InvocationTargetException e) {
e.printStackTrace();
}
//调用Service的方法进行数据库的插入
UserService userService = new UserServiceImpl();
userService.add(user);
//完成之后跳转userList中
response.sendRedirect(request.getContextPath()+"/findUserByPageServlet");
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);
}
}
*UserServiceImpl
@Override
public void add(User user) {
dao.add(user);
}
*UserDaoImpl
@Override
public void add(User user) {
//定义sql语句
String sql = "insert into user values(null,?,?,?,?,?,?)";
int count = template.update(sql, user.getName(), user.getGender(), user.getAge(), user.getAddress(), user.getQq(),
user.getEmail());
if (count > 0){
System.out.println("插入成功!!");
}
}
3. 删除
*思路
1. 点击删除按钮，将记录的id绑定到参数访问 delUserServlet
* 绑定id： href="javascript:delUser(${user.id})，将id传进js方法，并作confirm确认操作
2. 调用service层的deluser()方法进行数据的删除
3. 跳转到userlistServlet转发至list.jsp进行页面的显示(el+jstl)
* delUserServlet
import com.qin.service.UserService;
import com.qin.service.impl.UserServiceImpl;
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("/delUserServlet")
public class DelUserServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//设置参数
request.setCharacterEncoding("utf-8");
//获取参数id
String id = request.getParameter("id");
int num = Integer.parseInt(id);
//调用service方法deleteUser删除
UserService service = new UserServiceImpl();
service.delUser(num);
//返回查询
response.sendRedirect(request.getContextPath()+"/findUserByPageServlet");
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);
}
}
* UserServiceImpl
@Override
public void delUser(int id) {
dao.delUser(id);
}
* UserDaoImpl
@Override
public void delUser(int id) {
//定义sql语句
String sql = "delete from user where id = ?";
int count = template.update(sql, id);
if (count > 0){
System.out.println("删除成功!!");
}
}
4. 修改
*思路
1. 点击修改按钮，绑定记录的id参数访问 finduserServlet
2. 调用service的方法将数据回写到update.jsp中（el+jstl进行回写后的显示）
3. 更新完毕后，点击提交按钮，访问updateUserServlet（id使用隐藏域的方式提交）
4. 获取表单参数map，并封装成对象，调用service方法完成修改
5. 跳转到userlistServlet转发至list.jsp进行页面的显示(el+jstl)
* finduserservlet
import com.qin.domain.Province;
import com.qin.domain.User;
import com.qin.service.UserService;
import com.qin.service.impl.UserServiceImpl;
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;
import java.util.List;
@WebServlet("/findUserServlet")
public class FindUserServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//设置页面的编码
request.setCharacterEncoding("utf-8");
//获取参数id
String id = request.getParameter("id");
int num = Integer.parseInt(id);
//根据id查询用户
UserService userService = new UserServiceImpl();
User user = userService.find(num);
if (user != null){
//进行跳转页面
List<Province> pros = userService.getAllPro();
request.setAttribute("pros",pros);
request.setAttribute("user",user);
request.getRequestDispatcher("/update.jsp").forward(request,response);
}
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);
}
}
* UserServiceImpl
@Override
public User find(int id) {
return dao.find(id);
}
//省份的查询显示
@Override
public List<Province> getAllPro() {
return dao.getAll();
}
* UserDaoImpl
@Override
public User find(int id) {
//查询单个用户
String sql = "select * from user where id = ?";
User user = template.queryForObject(sql, new BeanPropertyRowMapper<>(User.class), id);
return user;
}
@Override
public List<Province> getAll() {
try {
String sql = "SELECT * FROM province";
List<Province> provinces = template.query(sql, new BeanPropertyRowMapper<>(Province.class));
return provinces;
} catch (DataAccessException e) {
return null;
}
}
//完成更新后的servlet
import com.qin.domain.User;
import com.qin.service.UserService;
import com.qin.service.impl.UserServiceImpl;
import org.apache.commons.beanutils.BeanUtils;
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;
import java.lang.reflect.InvocationTargetException;
import java.util.Map;
@WebServlet("/updateUserServlet")
public class UpdateUserServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//设置request的相应参数
request.setCharacterEncoding("utf-8");
//获取传递的参数,封装成为对象
Map<String, String[]> parameterMap = request.getParameterMap();
User user = new User();
try {
BeanUtils.populate(user,parameterMap);
} catch (IllegalAccessException e) {
e.printStackTrace();
} catch (InvocationTargetException e) {
e.printStackTrace();
}
// System.out.println(user);
//调用Service的方法进行数据库的修改
UserService userService = new UserServiceImpl();
int update = userService.update(user);
if (update > 0){
//更新成功
System.out.println("更新成功!");
//完成之后跳转userList中
request.getRequestDispatcher("/findUserByPageServlet").forward(request,response);
}
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
this.doPost(request, response);
}
}
* UserServiceImpl
@Override
public int update(User user) {
return dao.update(user);
}
* UserDaoImpl
@Override
public int update(User user) {
String sql = "UPDATE USER SET NAME=?,gender=?,age=?,address=?,qq=?,email=? WHERE id = ?";
int count = template.update(sql,user.getName(),user.getGender(),user.getAge(),user.getAddress(),user.getQq(),user.getEmail(),user.getId());
return count;
}
* list.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<!-- 网页使用的语言 -->
<html lang="zh-CN">
<head>
<!-- 指定字符集 -->
<meta charset="utf-8">
<!-- 使用Edge最新的浏览器的渲染方式 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- viewport视口：网页可以根据设置的宽度自动进行适配，在浏览器的内部虚拟一个容器，容器的宽度与设备的宽度相同。
width: 默认宽度与设备的宽度相同
initial-scale: 初始的缩放比，为1:1 -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
<title>用户信息管理系统</title>
<!-- 1. 导入CSS的全局样式 -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- 2. jQuery导入，建议使用1.9以上的版本 -->
<script src="js/jquery-2.1.0.min.js"></script>
<!-- 3. 导入bootstrap的js文件 -->
<script src="js/bootstrap.min.js"></script>
<style type="text/css">
td, th {
text-align: center;
}
</style>
<script>
function delUser(id) {
if (confirm("确定删除吗?")) {
location.href = "${pageContext.request.contextPath}/delUserServlet?id=" + id;
}
}
</script>
</head>
<body>
<div class="container">
<h3 style="text-align: center">用户信息列表</h3>
<div style="float: left;">
<form class="form-inline">
<div class="form-group">
<label for="exampleInputName2">姓名</label>
<input type="text" class="form-control" id="exampleInputName2">
</div>
<div class="form-group">
<label for="exampleInputName2">籍贯</label>
<input type="text" class="form-control" id="exampleInputName3">
</div>
<div class="form-group">
<label for="exampleInputEmail2">邮箱</label>
<input type="email" class="form-control" id="exampleInputEmail2">
</div>
<button type="submit" class="btn btn-default">查询</button>
</form>
</div>
<div style="float: right; margin: 5px">
<a class="btn btn-primary" href="${pageContext.request.contextPath}/getProServlet">添加联系人</a>
<a class="btn btn-primary" href="javascript:delSelected()">删除所选</a>
</div>
<form action="${pageContext.request.contextPath}/delSelectesUserServlet" method="post" id="form">
<table border="1" class="table table-bordered table-hover">
<tr class="success">
<th><label for="firstCb">全选</label><input type="checkbox" id="firstCb"></th>
<th>编号</th>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
<th>籍贯</th>
<th>QQ</th>
<th>邮箱</th>
<th>操作</th>
</tr>
<c:forEach items="${users}" var="user" varStatus="s">
<tr>
<td><input type="checkbox" id="uid" name="uid" value="${user.id}"></td>
<td>${s.count}</td>
<td>${user.name}</td>
<td>${user.gender}</td>
<td>${user.age}</td>
<td>${user.address}</td>
<td>${user.qq}</td>
<td>${user.email}</td>
<td><a class="btn btn-default btn-sm"
href="${pageContext.request.contextPath}/findUserServlet?id=${user.id}">修改</a> <a
class="btn btn-default btn-sm"
href="javascript:delUser(${user.id})">删除</a></td>
</tr>
</c:forEach>
</table>
</form>
<div>
<nav>
<ul class="pagination">
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">«</span>
</a>
</li>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">»</span>
</a>
</li>
<span style="font-size: 20px;margin-left: 5px">共16条记录，共4页</span>
</ul>
</nav>
</div>
</div>
</body>
</html>
* update.jsp
<!DOCTYPE html>
<!-- 网页使用的语言 -->
<html lang="zh-CN">
<head>
<base href="<%=basePath%>"/>
<!-- 指定字符集 -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>修改用户</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="js/jquery-2.1.0.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</head>
<body>
<div class="container" style="width: 400px;">
<h3 style="text-align: center;">修改联系人</h3>
<form action="" method="post">
<div class="form-group">
<label for="name">姓名：</label>
<input type="text" class="form-control" id="name" name="name" readonly="readonly" placeholder="请输入姓名" />
</div>
<div class="form-group">
<label>性别：</label>
<input type="radio" name="sex" value="男" />男
<input type="radio" name="sex" value="女" />女
</div>
<div class="form-group">
<label for="age">年龄：</label>
<input type="text" class="form-control" id="age" name="age" placeholder="请输入年龄" />
</div>
<div class="form-group">
<label for="address">籍贯：</label>
<select name="address" class="form-control" >
<option value="广东">广东</option>
<option value="广西">广西</option>
<option value="湖南">湖南</option>
</select>
</div>
<div class="form-group">
<label for="qq">QQ：</label>
<input type="text" class="form-control" name="qq" placeholder="请输入QQ号码"/>
</div>
<div class="form-group">
<label for="email">Email：</label>
<input type="text" class="form-control" name="email" placeholder="请输入邮箱地址"/>
</div>
<div class="form-group" style="text-align: center">
<input class="btn btn-primary" type="submit" value="提交" />
<input class="btn btn-default" type="reset" value="重置" />
<input class="btn btn-default" type="button" value="返回"/>
</div>
</form>
</div>
</body>
</html>
* add.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!-- HTML5文档-->
<!DOCTYPE html>
<!-- 网页使用的语言 -->
<html lang="zh-CN">
<head>
<!-- 指定字符集 -->
<meta charset="utf-8">
<!-- 使用Edge最新的浏览器的渲染方式 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- viewport视口：网页可以根据设置的宽度自动进行适配，在浏览器的内部虚拟一个容器，容器的宽度与设备的宽度相同。
width: 默认宽度与设备的宽度相同
initial-scale: 初始的缩放比，为1:1 -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
<title>添加用户</title>
<!-- 1. 导入CSS的全局样式 -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- 2. jQuery导入，建议使用1.9以上的版本 -->
<script src="js/jquery-2.1.0.min.js"></script>
<!-- 3. 导入bootstrap的js文件 -->
<script src="js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<center><h3>添加联系人页面</h3></center>
<form action="${pageContext.request.contextPath}/addUserServlet" method="post">
<div class="form-group">
<label for="name">姓名：</label>
<input type="text" class="form-control" id="name" name="name" placeholder="请输入姓名">
</div>
<div class="form-group">
<label>性别：</label>
<input type="radio" name="gender" value="男" checked="checked"/>男
<input type="radio" name="gender" value="女"/>女
</div>
<div class="form-group">
<label for="age">年龄：</label>
<input type="text" class="form-control" id="age" name="age" placeholder="请输入年龄">
</div>
<div class="form-group">
<label for="address">籍贯：</label>
<select name="address" class="form-control" id="jiguan">
<c:forEach items="${pros}" var="pro">
<option value="${pro.addre}">${pro.addre}</option>
</c:forEach>
<%--<option value="广西">广西</option>--%>
<%--<option value="湖南">湖南</option>--%>
</select>
</div>
<div class="form-group">
<label for="qq">QQ：</label>
<input type="text" class="form-control" name="qq" placeholder="请输入QQ号码"/>
</div>
<div class="form-group">
<label for="email">Email：</label>
<input type="text" class="form-control" name="email" placeholder="请输入邮箱地址"/>
</div>
<div class="form-group" style="text-align: center">
<input class="btn btn-primary" type="submit" value="提交" />
<input class="btn btn-default" type="reset" onclick="location.reload()" value="重置" />
<input class="btn btn-default" type="button" onclick="history.go(-1)" value="返回" />
</div>
</form>
</div>
</body>
</html>