JavaWeb - 联系人信息管理综合练习外链图片还未修改

最新推荐文章于 2021-08-26 18:49:28 发布

VIP文章锅巴QAQ

最新推荐文章于 2021-08-26 18:49:28 发布

阅读量320

点赞数

分类专栏： JavaWeb 文章标签： tomcat CSS jsp javascript web

本文链接：https://blog.csdn.net/pit3369/article/details/104354676

版权

文章目录

今日内容

今日内容

综合练习
1. 简单功能
  1. 列表查询
  2. 登录
  3. 添加
  4. 删除
  5. 修改
2. 复杂功能
  1. 删除选中
  2. 分页查询
    - 好处：
      1. 减轻服务器内存的开销
      2. 提升用户体验
  3. 复杂条件查询

项目代码及依赖文件：访问github

1-界面展示

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-AO8kZLkQ-1581908837653)(D:\md_photos\image-20200216142805119.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-1yvl4CUZ-1581908837655)(D:\md_photos\image-20200216142839088.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-YzJwByq9-1581908837657)(D:\md_photos\image-20200216142935542.png)]

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-315kVYpu-1581908837661)(D:\md_photos\image-20200214110816360.png)]

之前由于未加入CSS文件夹下的内容，网页格式完全错误！加入css文件后正常！

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-xkHqUuzm-1581908837663)(D:\md_photos\image-20200214110907532.png)]
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-WgjWWZZE-1581908837664)(D:\md_photos\image-20200214111143859.png)]

界面终于好了！


<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" name="name" class="form-control" id="exampleInputName2" >
            </div>
        </form>

    </div>

    <div style="float: right;margin: 5px;">	
    <!-- 添加、删除按钮右对齐；使得二者在同一行内左右而立-->
        <a class="btn btn-primary" href="${pageContext.request.contextPath}/add.jsp">添加联系人</a>
        <a class="btn btn-primary" href="add.html">删除选中</a>

    </div>

    <table border="1" class="table table-bordered table-hover">
    <!-- 表格-带边框且边框为1个像素 带鼠标悬停 -->
        <tr class="success">
            <th><input type="checkbox"></th>
            <th>编号</th>
            <th>姓名</th>
            <th>性别</th>
            <th>年龄</th>
            <th>籍贯</th>
            <th>QQ</th>
            <th>邮箱</th>
            <th>操作</th>
        </tr>
    </table>
    </div>

</div>

2-登录

调整页面，加入验证码功能

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-WrB9dfAz-1581908837667)(D:\md_photos\image-20200213171504124.png)]
代码实现

3-添加联系人

增加按钮–新增add页面并连接action–新增AddUserServlet.java方法 – UserService中增加adduser服务 – 在UserDao中新增adduser操作数据库

在list.jsp内修改：

<a class="btn btn-primary" href="${pageContext.request.contextPath}/add.jsp">添加联系人</a>

新增add.jsp文件，并修改其中主要的action：

<center><h3>添加联系人页面</h3></center>
    <form action="${pageContext.request.contextPath}/addUserServlet" method="post">

新增AddUserServlet.java文件

设置编码、获取request参数、封装对象(捕获异常)、

//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();
}

调用Service保存User、跳转到userlistServlet

//4.调用Service保存
UserService service = new UserServiceImpl();
service.addUser(user);

//5.跳转到userListServlet，getContextPath获取到虚拟路径，
response.sendRedirect(request.getContextPath()+"/userListServlet");

在UserService中增加方法 addUser(User user)；在UserServiceImpl中重写该方法

@Override
public void addUser(User user) {
   
    dao.add(user);
}

在UserDao接口中定义add(User user)方法；在UserDaoImpl中重写方法

@Override
    public void add(User user) {
     

        //1.定义sql,ID为null,自增长；其余6个属性为？
        String sql = "insert into user values(null,?,?,?,?,?,?)";
        //2.执行sql
        template.update(sql, user.getName(), user.getGender(), user.getAge(), user.getAddress(), user.getQq(), user.getEmail());
    }

4-删除联系人

点击删除，直接进入DelUserServlet程序，绑定参数：这条记录的id。

DelUserServlet：

获取参数：用户id；调用service删除；跳转查询所有的Servlet。

UserService：

public void deleteUser(String id){
	dao.delete(Integer.parseInt(id));
}

UserDao：

public void delete(int id){
	操作数据库删除
}

在list.jsp中，修改删除的href

<td><a class="btn btn-default btn-sm" href="update.html">修改</a>&nbsp;
                    <a class="btn btn-default btn-sm" href="${pageContext.request.contextPath}/delUserServlet?id=${user.id}">删除</a>
</td>

新增DelUserServlet.java

//1.获取id
String id = request.getParameter("id");
//2.调用service删除
UserService service = new UserServiceImpl();
service.deleteUser(id);

//3.跳转到查询所有Servlet
response.sendRedirect(request.getContextPath() + "/userListServlet");

在UserService接口中定义deleteUser方法；在UserServiceImpl重写deleteUser方法；

/**
* 根据id来删除User
* @param id
*/
void deleteUser(String id);

@Override
public void deleteUser(String id) {
     
    dao.delete(Integer.parseInt(id));
}

在UserDao接口中定义delete方法；在UserDaoImpl重写delete方法；

void delete(int parseInt);

@Override
public void delete(int id) {
     
    //1.定义sql
    String sql = "delete from user where id = ?";
    //2.执行sql
    template.update(sql, id);
}

至此！删除功能完善好了，但是出现的问题就是：如果误点删除呢？都不出现，确认删除的弹窗吗？那就修改一下“删除”按钮后的href吧！

修改list.jsp中删除按钮的href如下；并在list头部添加script定义；

<a class="btn btn-default btn-sm" href="javascript:deleteUser(${user.id});">删除</a></td>

<script>
    function deleteUser(id) {
        //用户安全提示
        if (confirm("您确定要删除吗？")) {
            //访问路径
            location.href = "${pageContext.request.contextPath}/delUserServlet?id=" + id;
        }

    }
</script>

5-修改联系人

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-FIgVbKpG-1581908837671)(D:\md_photos\image-20200214142529736.png)]

新增update.jsp文件

在修改联系人页面内，潜在一个隐藏域，用来传递联系人id。

<div class="container" style="width: 400px;">
    <h3 style="text-align: center;">修改联系人</h3>
    <form action="${pageContext.request.contextPath}/updateUserServlet" method="post">
        <!-- 隐藏域 提交id -->
        <input type="hidden" name="id" value="${user.id}">

    </form>
</div>

新增FindUserServlet

//1.获取id
String id = request.getParameter("id");//request域好像只能为String类型，所以下面需要强制类型转换
//2.调用Servlet查询
UserService service = new UserServiceImpl();
User user = service.findUserById(id);

//3.将user存入request
request.setAttribute("user", user)<

最低0.47元/天解锁文章

锅巴QAQ

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaWeb - 联系人信息管理综合练习外链图片还未修改

文章目录今日内容1-界面展示2-登录3-添加联系人4-删除联系人5-修改联系人6-删除选中的联系人7-分页查询功能服务器端客户端在domain包内新建PageBean对象前端后台调用8-复杂条件查询今日内容综合练习简单功能列表查询登录添加删除修改复杂功能删除选中分页查询好处：减轻服务器内存的开销提升用户体验复杂条件查询...
复制链接

扫一扫