用户信息管理系统总结
2024-07-04 08:10:46
目录
1 登录
1.1 登录界面
1.2 Servlet
2 index界面
3 添加功能
3.1 添加逻辑图
3.2 代码修改
3.3 addUserServlet
4 删除功能
4.1 删除逻辑图
4.2 delUserServlrt
5 修改功能
5.1 修改逻辑图
5.2 findUserServlet
5.3 udate的html页面代码
5.4 updateUserServlet
6 删除选中功能
6.1 删除选中逻辑图
6.2 全选，全不选
6.2 删除选中
7 分页查询
7.1 分析和逻辑图
7.2 PageBean实体类
7.3 分页展示
7.4 service方法
8 复杂条件分页查询
8.1 分析图
8.2 sql语句
前言：为方便以后遗忘可以查看，对这个小项目的一些界面，功能作出一些分析和总结
1 登录
一般开始，都会有个登录界面，实现一些登录功能
1.1 登录界面
下面展示的是登录的jsp页面，代码是html界面，会对其进行修改为jsp页面，方便以后可以在其基础上进行修改使用
html页面展示
修改后的jsp页面展示
html界面代码
<!DOCTYPE html>
<html lang="zh-CN"><head><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><!-- 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><script type="text/javascript"></script></head><body><div class="container" style="width: 400px;"><h3 style="text-align: center;">管理员登录</h3><form action="login" method="post"><div class="form-group"><label for="user">用户名：</label><input type="text" name="user" class="form-control" id="user" placeholder="请输入用户名"/></div><div class="form-group"><label for="password">密码：</label><input type="password" name="password" class="form-control" id="password" placeholder="请输入密码"/></div><div class="form-inline"><label for="vcode">验证码：</label><input type="text" name="verifycode" class="form-control" id="verifycode" placeholder="请输入验证码" style="width: 120px;"/><a href="javascript:refreshCode()"><img src="vcode" title="看不清点击刷新" id="vcode"/></a></div><hr/><div class="form-group" style="text-align: center;"><input class="btn btn btn-primary" type="submit" value="登录"></div></form><!-- 出错显示的信息框 --><div class="alert alert-warning alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert" ><span>×</span></button><strong>登录失败!</strong></div></div></body>
</html>在原基础上增加了一个验证码的Servlet，有很多途径可以copy，这里就不展示了
这里我们完善javascript的refreshCode()方法，并修改src的路径
方法完善
<script type="text/javascript">function refreshCode() {//1.获取验证码图片对象var vcode = document.getElementById("vcode");//2.设置src属性，加时间戳vcode.src="${pageContext.request.contextPath}/checkCodeServlet?time="+new Date().getTime();}</script>1.2 Servlet
接受表单信息，对其进行数据处理，反馈信息给登录界面，以及，登陆成功后跳转到index界面
//1.设置编码request.setCharacterEncoding("utf-8");//2.获取数据//2.1获取用户输入的验证码String verifycode = request.getParameter("verifycode");//2.2获取自动生成的验证码String checkcode = (String)request.getSession().getAttribute("CHECKCODE_SERVER");//确保验证码一次性request.getSession().removeAttribute("CHECKCODE_SERVER");//2.2验证码校验 忽略大小写if (!checkcode.equalsIgnoreCase(verifycode)){//不正确，跳转提示request.setAttribute("login_msg","验证码错误");//request.removeAttribute("login_msg");//web下加/request.getRequestDispatcher("/login.jsp").forward(request,response);return;}//2.3获取所有数据Map<String, String[]> map = request.getParameterMap();//3.封装对象User user = new User();try {BeanUtils.populate(user,map);} catch (IllegalAccessException e) {e.printStackTrace();} catch (InvocationTargetException e) {e.printStackTrace();}//4.调用service方法UserServiceImpl userService = new UserServiceImpl();User login = userService.login(user);//5.判断if (login!=null){//成功request.getSession().setAttribute("user",login);response.sendRedirect(request.getContextPath()+"/index.jsp");}else {//失败//不正确，跳转提示request.setAttribute("login_msg","用户名或密码错误");//web下加/request.getRequestDispatcher("/login.jsp").forward(request,response);}2 index界面
html代码
修改为jsp页面
获取到上面servlet里session域中的user
展示结果为
之后会跳转到pageServlet，进行数据处理，再转发到list.jsp页面展示
pageServlet代码
request.setCharacterEncoding("utf-8");//获取页数和行数String currentPage = request.getParameter("currentPage");String rows = request.getParameter("rows");//判断两个参数是否为空if (currentPage==null||"".equals(currentPage)){currentPage="1";}if (rows==null||"".equals(rows)){rows="5";}//获取条件查询Map<String, String[]> condition = request.getParameterMap();//调用service方法UserServiceImpl userService = new UserServiceImpl();PageBean<User> pb = userService.findUserByPage(currentPage, rows,condition);//System.out.println(pb);//存到request域request.setAttribute("pb",pb);request.setAttribute("condition",condition);//转发request.getRequestDispatcher("/list.jsp").forward(request,response);list界面展示
list.html代码
<!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>
</head>
<body>
<div class="container"><h3 style="text-align: center">用户信息列表</h3><table border="1" class="table table-bordered table-hover"><tr class="success"><th>编号</th><th>姓名</th><th>性别</th><th>年龄</th><th>籍贯</th><th>QQ</th><th>邮箱</th><th>操作</th></tr><tr><td>1</td><td>张三</td><td>男</td><td>20</td><td>广东</td><td>44444222</td><td>zs@qq.com</td><td><a class="btn btn-default btn-sm" href="update.html">修改</a> <a class="btn btn-default btn-sm" href="">删除</a></td></tr><tr><td>2</td><td>张三</td><td>男</td><td>20</td><td>广东</td><td>44444222</td><td>zs@qq.com</td><td><a class="btn btn-default btn-sm" href="update.html">修改</a> <a class="btn btn-default btn-sm" href="">删除</a></td></tr><tr><td>3</td><td>张三</td><td>男</td><td>20</td><td>广东</td><td>44444222</td><td>zs@qq.com</td><td><a class="btn btn-default btn-sm" href="update.html">修改</a> <a class="btn btn-default btn-sm" href="">删除</a></td></tr><tr><td>4</td><td>张三</td><td>男</td><td>20</td><td>广东</td><td>44444222</td><td>zs@qq.com</td><td><a class="btn btn-default btn-sm" href="update.html">修改</a> <a class="btn btn-default btn-sm" href="">删除</a></td></tr><tr><td>5</td><td>张三</td><td>男</td><td>20</td><td>广东</td><td>44444222</td><td>zs@qq.com</td><td><a class="btn btn-default btn-sm" href="update.html">修改</a> <a class="btn btn-default btn-sm" href="">删除</a></td></tr><tr><td colspan="8" align="center"><a class="btn btn-primary" href="add.html">添加联系人</a></td></tr></table>
</div>
</body>
</html>
所有功能完善后是下面这样，下面将一步步完善
3 添加功能
点击添加联系人后会跳转到添加界面add.jsp
3.1 添加逻辑图
一般情况下，servlet作为控制器，获取到客户端浏览器（也就是页面上）的数据，对其进行封装，调用service，最后进行跳转。service作为业务逻辑层，一般对数据进行逻辑操作，Dao作为数据处理层，一般与数据库进行交互，获取数据，最终将数据展现在页面上
3.2 代码修改
添加的html代码
<!-- 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="" 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="sex" value="男" checked="checked"/>男<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" id="jiguan"><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>在添加页面完成数据填写后，提交表单，交给addServlet进行数据处理
重置功能没有完善，返回完善了，根据id添加一个单击事件，跳转到list页面
3.3 addUserServlet
//1.设置编码request.setCharacterEncoding("utf-8");//2.获取数据Map<String, String[]> map = request.getParameterMap();//3.封装对象User user = new User();try {BeanUtils.populate(user,map);} catch (IllegalAccessException e) {e.printStackTrace();} catch (InvocationTargetException e) {e.printStackTrace();}//4.调用service方法UserServiceImpl userService = new UserServiceImpl();userService.addUser(user);//5.跳转到userListServletresponse.sendRedirect(request.getContextPath()+"/pageServlet");4 删除功能
4.1 删除逻辑图
为完成数据动态展示，用for循环修改原码
为了删除数据，给deleteUser方法传递user的唯一id，点击删除按钮，将执行方法
为确保不小心删除数据，给按钮添加一个confirm提示，将id传给delUserServlrt后就可以进行数据删除了
4.2 delUserServlrt
String[] userIds = request.getParameterValues("userId");UserServiceImpl userService = new UserServiceImpl();userService.delSelectedUser(userIds);response.sendRedirect(request.getContextPath()+"/pageServlet");new 一个service对象，调用删除方法，跳转到list展示页面
5 修改功能
5.1 修改逻辑图
可以在update页面看见，我们提交没有id，但是在数据库中修改，需要id来确定，所以用了两个servlet，findUserServlet和上面删除一样，获取id，将id转发给update页面，所以先写 findUserServlet
5.2 findUserServlet
//1.获取数据String id = request.getParameter("id");UserServiceImpl userService = new UserServiceImpl();User user = userService.findUserById(id);//System.out.println(user);//将user存入requestrequest.setAttribute("user",user);request.getRequestDispatcher("/update.jsp").forward(request,response);因为在表单中要回显消息，也就是展示没修改前数据的信息，所以在获取id的同时将所有信息获取到，存到request域中
5.3 udate的html页面代码
<!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>回显信息修改
增加有一个value属性，就可以了，其他位置一样
注意：表单提交需要name属性，否则数据获取不到
在表单中可以看见没有id的提交，用户看不见id，所以需要写一个隐藏域
注意：表单提交只提交form里面的，隐藏域可以在form表单里任意位置写，但是不能写到form表单外
5.4 updateUserServlet
request.setCharacterEncoding("utf-8");Map<String, String[]> map = request.getParameterMap();User user = new User();try {BeanUtils.populate(user,map);} catch (IllegalAccessException e) {e.printStackTrace();} catch (InvocationTargetException e) {e.printStackTrace();}//System.out.println(user);UserServiceImpl userService = new UserServiceImpl();userService.updateUser(user);response.sendRedirect(request.getContextPath()+"/pageServlet");6 删除选中功能
6.1 删除选中逻辑图
最主要就是获取到选中的id，再将其提交给DeletedServlet
先完成一个功能，全选和全不选
6.2 全选，全不选
在每行前面加一个checkbox复选框，根据id=firstCB写个方法
6.2 删除选中
给删除选中按钮绑定一个单击事件，提交id数组
7 分页查询
7.1 分析和逻辑图
分页，以后可以按这个套路写，首先要写一个实体类来存上面五种数据
7.2 PageBean实体类
分析后可知，我们只需要知道当前页数可每页展示行数可以得到其余三个数据
7.3 分页展示
通过for循环动态生成页数，给一个默认每页行数，再给一个选中激活的判断
页数后的文字提示
给上一页和下一页在第一页和最后一页一个不可再点击提示，以及点击后仍是第一页或最后一页
7.4 service方法
@Overridepublic PageBean<User> findUserByPage(String _currentPage, String _rows, Map<String, String[]> condition) {int currentPage = Integer.parseInt(_currentPage);int rows = Integer.parseInt(_rows);if (currentPage<=0){currentPage=1;}PageBean<User> pb = new PageBean<>();//设置参数pb.setRows(rows);//查询总个数int totalCount = userDao.findTotalCount(condition);pb.setTotalCount(totalCount);//查询list集合int start=(currentPage-1)*rows;List<User> list = userDao.findByPage(start, rows,condition);pb.setList(list);//计算总页数int totalPage=totalCount%rows==0?totalCount/rows:(totalCount/rows)+1;pb.setTotalPage(totalPage);pb.setCurrentPage(currentPage);return pb;}8 复杂条件分页查询
8.1 分析图
最主要的就是sql语句的编写
8.2 sql语句
@Overridepublic int findTotalCount(Map<String, String[]> condition) {//定义模板 初始化sqlString sql="select count(*) from user where 1=1 ";//遍历mapStringBuilder sb = new StringBuilder(sql);Set<String> keySet = condition.keySet();ArrayList<Object> list = new ArrayList<>();for (String key:keySet) {if ("currentPage".equals(key)||"rows".equals(key)){continue;}String value = condition.get(key)[0];if (value!=null&&!"".equals(value)){//有值//拼接 注意sql语句空格 可以多加几个sb.append(" and "+key+" like ? ");//存？的值list.add("%"+value+"%");}}return template.queryForObject(sb.toString(),Integer.class,list.toArray());}@Overridepublic List<User> findByPage(int start, int rows, Map<String, String[]> condition) {String sql="select * from user where 1=1 ";//遍历mapStringBuilder sb = new StringBuilder(sql);Set<String> keySet = condition.keySet();ArrayList<Object> list = new ArrayList<>();for (String key:keySet) {if ("currentPage".equals(key)||"rows".equals(key)){continue;}String value = condition.get(key)[0];if (value!=null&&!"".equals(value)){//有值//拼接 注意sql语句空格 可以多加几个sb.append(" and "+key+" like ? ");//存？的值list.add("%"+value+"%");}}//添加分页sb.append(" limit ?,?");list.add(start);list.add(rows);sql=sb.toString();// System.out.println(sql);
// System.out.println(list);return template.query(sql,new BeanPropertyRowMapper<>(User.class),list.toArray());}写这个小项目，细节东西很多，一不注意就报错，还是得慢慢写慢慢看，掌握后可能会好点
用户信息管理系统总结相关推荐
- Java+Swing+mysql用户信息管理系统
Java+Swing+mysql用户信息管理系统 一.系统介绍 二.功能展示 1.管理员登陆 2.用户信息查询 3.用户信息添加 4.用户信息修改 5.用户信息删除 三.项目相关 3.1 乱码问题 3 ...
- 用户信息管理系统测试报告
目录 一.测试环境 二.系统测试 三.测试用例 四.单元测试 1.登录测试 2.添加测试 3.删除测试 4.ID查找测试 5.更新测试 6.条件查找测试 7.返回符合条件的用户数测试 一.测试环境 项 ...
- 案例：用户信息管理系统
案例:用户信息管理系统 1.需求 1.1 说明 用户信息列表展示,并且可以对用户信息的进行增删改查操作 1.2 效果图 根据需求,创建效果图,如下: 2.设计 2.1 技术选型 完成本次案例所用使用的 ...
- mvc三层架构(用户信息管理系统）
mvc三层架构(实战项目 用户信息管理系统) 一.三层架构 View 层:用于接收用户提交请求的代码. Service 层:系统的业务逻辑主要在这里完成. Dao 层:直接操作数据库的代码. 二.三层 ...
- 用户信息管理系统（Javaweb实践练习项目，附源码）
目录 前言 1. 系统概述 2. 系统各功能实现思路 2.1 列表查询 2.2 登录 2.3 添加 2.4 删除 2.5 修改 2.6 删除选中 2.7 分页查询 2.8 复杂条件查询 3. 系统源代 ...
- 初学Java，先搞懂第一个程序-----简易用户信息管理系统
初学Java!!!一定要搞懂第一个程序-----简易用户信息管理系统 用户需求 ①实现用户信息添加,包括用户名.年龄.爱好.冻结状态: ②查询指定用户信息,根据用户名查询指定用户的信息是否在用户数据库 ...
- JavaWeb11 —— 用户信息管理系统
JSP案例--用户信息管理系统 1.需求 简单的用户信息管理系统 对用户信息的增删改查 效果截图(部分) 2.设计 技术选型 Servlet + jsp + Mysql + jdbctemplate ...
- [Web技术]用户信息管理系统
工程文件:用户信息管理系统 开发时间:2022.03 - 2022.04 文章目录 一.快速开始 二.任务概述 三.分析与设计 3.1 需求分析 3.2 总体设计 四.功能展示 4.1 用户登录 4. ...
- JavaWeb:用户信息管理系统
目录: 前言: 一.需求分析: 1. 简单功能 2. 复杂功能 3.登录: 二.设计: 1. 技术选型: 2. 数据库设计: 三.开发: 1. 环境搭建 1. 创建数据库环境(mysql8.0) 2. ...
最新文章
- 一个学机械的毕业生令中国人无法安眠的帖子
- jdk12 switch_玩JDK 12的Switch表达式
- 快应用比赛_我的应用如何在国际学生比赛中获得第三名
- 通过纯css实现图片居中的多种实现方式
- iis7 mysql_windows 7 下搭建php开发环境(windows7+IIS7+php+mysql)
- Invalid options in vue.config.js: “baseUrl“ is not allowed
- theano 编程技巧
- 解决Spring MVC整合Shiro出现无法访问静态资源文件的问题
- 比较好的浏览器_一款安卓黑科技手机浏览器 体积很小，功能很6！
- python 期货策略_Python版商品期货跨期对冲策略
- 运维项目经验示例(参考)
- CSS 实现鼠标移动到图片上图片变大
- 常规WebRoot项目在Idea中通过tomcat运行
- 拉结尔6月21日服务器维护,《拉结尔》6月19日换端更新公告
- 投稿流程以及审稿状态
- 编解码(1)之基本像素格式转换
- jupyter notebook第七章seaborn库的一些案例分析加相关函数的解析
- PHP 十六大魔术方法学习
- 易推宝网络推广效果怎么样？
- 全站 HTTPS 来了