此项目作为一个小型的前后交互的用户信息管理系统

  • 登录界面
    • 登录页面展示
    • 登录部分代码展示
  • 主页显示页面
  • 添加功能
    • 页面显示
    • 代码展示
  • 修改功能
    • 修改页面显示
    • 修改代码展示
  • 删除功能
    • 删除页面显示
    • 删除代码展示
  • 查询
    • 模糊查询
  • 分页细节展示
  • 总结

登录界面

登录页面展示

登录部分代码展示


出错显示框

主页显示页面


代码展示

删除修改显示

添加功能

页面显示

代码展示

 <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="address"><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号码" id="qq"/></div><div class="form-group"><label for="email">Email:</label><input type="text" class="form-control" name="email" id="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>

修改功能

修改页面显示

修改代码展示

<div class="container" style="width: 400px;">
<h3 style="text-align: center;">修改联系人</h3>
<form action="${pageContext.request.contextPath}/updateUserServlet" method="post"><input type="hidden" name="id" value="${user.id}"><div class="form-group"><label for="name">姓名:</label><input type="text" class="form-control" id="name" value="${user.name}" name="name"  readonly="readonly" placeholder="请输入姓名" /></div><div class="form-group"><label>性别:</label><c:if test="${user.gender=='男'}"><input type="radio" name="gender" value="男" checked />男<input type="radio" name="gender" value="女"  />女</c:if><c:if test="${user.gender=='女'}"><input type="radio" name="gender" value="男"  />男<input type="radio" name="gender" value="女" checked />女</c:if></div><div class="form-group"><label for="age">年龄:</label><input type="text" class="form-control" id="age"value="${user.age}"  name="age" placeholder="请输入年龄" /></div><div class="form-group"><label for="address">籍贯:</label><c:if test="${user.address=='广东'}"><select name="address" class="form-control"  id="address"><option value="广东" selected>广东</option><option value="广西">广西</option><option value="湖南">湖南</option></select></c:if><c:if test="${user.address=='广西'}"><select name="address" class="form-control"  id="address"><option value="广东" selected>广东</option><option value="广西" selected>广西</option><option value="湖南">湖南</option></select></c:if><c:if test="${user.address=='湖南'}"><select name="address" class="form-control"  id="address"><option value="广东" selected>广东</option><option value="广西">广西</option><option value="湖南" selected>湖南</option></select></c:if></div><div class="form-group"><label for="qq">QQ:</label><input type="text" class="form-control" id="qq" name="qq" value="${user.qq}" placeholder="请输入QQ号码"/></div><div class="form-group"><label for="email">Email:</label><input type="text" class="form-control" name="email" id="email" value="${user.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>

删除功能

删除页面显示

删除代码展示

function deleteUser(id) {//${pageContext.request.contextPath}/delUserServlet?id=${user.id}if (confirm("您确定要删除吗?")) {location.href = "${pageContext.request.contextPath}/delUserServlet?id=" + id;}}window.onload=function () {//给删除选中绑定单击事件document.getElementById("delSelected").onclick=function () {//提交表单var flag=false;var uids = document.getElementsByName("uid");for (var i = 0; i <uids.length ; i++) {if(uids[i].checked){flag=true;}}if(flag==false){confirm("您没有选中条目");}if(flag){if(confirm("您确定要删除选中条目吗?")){document.getElementById("form").submit();}}}}

查询

模糊查询

分页细节展示


当前页面为1时,设为禁用,当你再次点上一页时,还在第一页
,最后一页时,也是如此,代码如下

<div><nav aria-label="Page navigation"><ul class="pagination"><c:if test="${pb.currentPage==1}"><li class="disabled"></c:if><c:if test="${pb.currentPage!=1}"><li></c:if><a href="${pageContext.request.contextPath}/findUserByPageServlet?currentPage=${pb.currentPage-1}&rows=5&name=${condition.name[0]}&address=${condition.address[0]}&email=${condition.email[0]}" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li><c:forEach begin="1" end="${pb.totalPage}" var="i"><c:if test="${pb.currentPage==i}"><li class="active"><a href="${pageContext.request.contextPath}/findUserByPageServlet?currentPage=${i}&rows=5&name=${condition.name[0]}&address=${condition.address[0]}&email=${condition.email[0]}">${i}</a></li></c:if><c:if test="${pb.currentPage!=i}"><li><a href="${pageContext.request.contextPath}/findUserByPageServlet?currentPage=${i}&rows=5&name=${condition.name[0]}&address=${condition.address[0]}&email=${condition.email[0]}">${i}</a></li></c:if></c:forEach><c:if test="${pb.currentPage==pb.totalPage}"><li class="disabled"><a href="${pageContext.request.contextPath}/findUserByPageServlet?currentPage=${pb.currentPage}&rows=5&name=${condition.name[0]}&address=${condition.address[0]}&email=${condition.email[0]}" aria-label="Next"><span aria-hidden="true">&raquo;</span></a></li></c:if><c:if test="${pb.currentPage<pb.totalPage}"><li><a href="${pageContext.request.contextPath}/findUserByPageServlet?currentPage=${pb.currentPage+1}&rows=5&name=${condition.name[0]}&address=${condition.address[0]}&email=${condition.email[0]}" aria-label="Next"><span aria-hidden="true">&raquo;</span></a></li></c:if><span style="font-size: 25px;margin: 5px;">共${pb.totalCount}条记录,共${pb.totalPage}页</span></ul></nav>
</div>

当然要实现此分页还离不开PageBean,封装分页需要用到的一些数据
public class PageBean {
private int totalCount;//总记录数
private int totalPage;// 总页码
private List list;//每页的数据
private int currentPage;//当前页码
private int rows;//每页显示的记录数

public int getTotalCount() {return totalCount;
}public void setTotalCount(int totalCount) {this.totalCount = totalCount;
}public int getTotalPage() {return totalPage;
}public void setTotalPage(int totalPage) {this.totalPage = totalPage;
}public List<T> getList() {return list;
}public void setList(List<T> list) {this.list = list;
}public int getCurrentPage() {return currentPage;
}public void setCurrentPage(int currentPage) {this.currentPage = currentPage;
}public int getRows() {return rows;
}public void setRows(int rows) {this.rows = rows;
}@Override
public String toString() {return "PageBean{" +"totalCount=" + totalCount +", totalPage=" + totalPage +", list=" + list +", currentPage=" + currentPage +", rows=" + rows +'}';}
}

总结

此小项目虽说不是很难,细节很多,有时候一个小问题,比如:jsp页面中name属性中字段和java实体类中的字段不匹配,很难发现。总的来说,细节决定成败!

IT黑马之用户信息管理系统相关推荐

  1. Java+Swing+mysql用户信息管理系统

    Java+Swing+mysql用户信息管理系统 一.系统介绍 二.功能展示 1.管理员登陆 2.用户信息查询 3.用户信息添加 4.用户信息修改 5.用户信息删除 三.项目相关 3.1 乱码问题 3 ...

  2. 用户信息管理系统测试报告

    目录 一.测试环境 二.系统测试 三.测试用例 四.单元测试 1.登录测试 2.添加测试 3.删除测试 4.ID查找测试 5.更新测试 6.条件查找测试 7.返回符合条件的用户数测试 一.测试环境 项 ...

  3. 案例:用户信息管理系统

    案例:用户信息管理系统 1.需求 1.1 说明 用户信息列表展示,并且可以对用户信息的进行增删改查操作 1.2 效果图 根据需求,创建效果图,如下: 2.设计 2.1 技术选型 完成本次案例所用使用的 ...

  4. mvc三层架构(用户信息管理系统)

    mvc三层架构(实战项目 用户信息管理系统) 一.三层架构 View 层:用于接收用户提交请求的代码. Service 层:系统的业务逻辑主要在这里完成. Dao 层:直接操作数据库的代码. 二.三层 ...

  5. 用户信息管理系统(Javaweb实践练习项目,附源码)

    目录 前言 1. 系统概述 2. 系统各功能实现思路 2.1 列表查询 2.2 登录 2.3 添加 2.4 删除 2.5 修改 2.6 删除选中 2.7 分页查询 2.8 复杂条件查询 3. 系统源代 ...

  6. 初学Java,先搞懂第一个程序-----简易用户信息管理系统

    初学Java!!!一定要搞懂第一个程序-----简易用户信息管理系统 用户需求 ①实现用户信息添加,包括用户名.年龄.爱好.冻结状态: ②查询指定用户信息,根据用户名查询指定用户的信息是否在用户数据库 ...

  7. JavaWeb11 —— 用户信息管理系统

    JSP案例--用户信息管理系统 1.需求 简单的用户信息管理系统 对用户信息的增删改查 效果截图(部分) 2.设计 技术选型 Servlet + jsp + Mysql + jdbctemplate ...

  8. [Web技术]用户信息管理系统

    工程文件:用户信息管理系统 开发时间:2022.03 - 2022.04 文章目录 一.快速开始 二.任务概述 三.分析与设计 3.1 需求分析 3.2 总体设计 四.功能展示 4.1 用户登录 4. ...

  9. 用户信息管理系统总结

    目录 1 登录 1.1 登录界面 1.2 Servlet 2 index界面 3  添加功能 3.1 添加逻辑图 3.2 代码修改 3.3 addUserServlet 4 删除功能 4.1 删除逻辑 ...

  10. JavaWeb:用户信息管理系统

    目录: 前言: 一.需求分析: 1. 简单功能 2. 复杂功能 3.登录: 二.设计: 1. 技术选型: 2. 数据库设计: 三.开发: 1. 环境搭建 1. 创建数据库环境(mysql8.0) 2. ...

最新文章

  1. 基于OpenCV的网络实时视频流传输
  2. MxGraph从入门到精通之2:HelloWorld程序解析
  3. 关于装箱拆箱导致的异常案例
  4. 模式分类笔记--聚类分析算法
  5. 用delphi 做服务器,basic4android 实现三层数据交互
  6. 通过OpenShift超越云技术
  7. ffmpeg 2.6.3在Windows系统MinGW的编译
  8. 使用PackageManager获得应用(包)信息
  9. java 回调函数实现_Java实现的回调函数
  10. X5Webview TbsReaderView背景色修改
  11. 技嘉主板开机自动进入bios怎么解决?
  12. [Linux 驱动]模块加载RTX8025驱动
  13. 我的007之skyfall歌词鉴赏及翻译
  14. Mac如何将图片一键转pdf
  15. 邮箱客户端程序的实现
  16. NET 模拟Htpp请求
  17. linux 权限 c,Linux下获取root权限的c程序
  18. matlab8邻域搜索算法,一种基于可搜索连续邻域A*算法的路径规划方法与流程
  19. 网线线序及网线转RS232—— DB9线序
  20. 文本与字体样式3.0

热门文章

  1. 华为路由器配置NAT
  2. 【微信小游戏】微信小游戏开发设置竖屏
  3. Google Cloud API设计指南
  4. 微信小程序生成跳转体验版二维码
  5. UI设计的色彩搭配及原则
  6. 环状序列|得分(UVa1584|UVa1585)
  7. DB2错误SQL1585N
  8. java 泛型 参数传递子类_超类的Java泛型,但并非所有子类都想定义类型参数
  9. html中背景图片等比例缩放,CSS实现响应式全屏背景图+用CSS3实现全屏按比例缩放背景图片...
  10. 手机连接linux共享打印机,连接Linux共享打印机