众筹网站项目第五天之用户的增、删、改

最新推荐文章于 2024-07-28 19:41:52 发布

阿粉online

最新推荐文章于 2024-07-28 19:41:52 发布

阅读量260

点赞数

分类专栏：众筹项目文章标签： java ajax js

本文链接：https://blog.csdn.net/qq_43451907/article/details/106580924

版权

众筹项目专栏收录该内容

14 篇文章 0 订阅

订阅专栏

打开原教程视频
注：本人是渣渣，有错请谅解。

增加用户

流程：点击新增按钮->跳转至用户信息填写页面->点击添加将数据保存到后台服务器并转到用户列表。
在这里插入图片描述

1、在userList.jsp的新增按钮添加跳转链接

2、在userController中添加方法返回指定的jsp页面

 /**
     * 返回新增用户页面
     * @return
     */
    @RequestMapping(value = "/toAddUser")
    public String toAddUser(){
        return "user/addUser";
    }

3、在webapp/jsp/user中创建addUser.jsp，下面的代码复制进去。

addUser.jsp内容

<%--
  Created by IntelliJ IDEA.
  User: 黄彬
  Date: 2020/6/4
  Time: 20:45
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<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">
    <meta name="description" content="">
    <meta name="author" content="">

    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/font-awesome.min.css">
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" href="css/doc.min.css">
    <style>
        .tree li {
            list-style-type: none;
            cursor:pointer;
        }
    </style>
</head>

<body>

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container-fluid">
        <div class="navbar-header">
            <div><a class="navbar-brand" style="font-size:32px;" href="user.html">众筹平台 - 用户维护</a></div>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
            <ul class="nav navbar-nav navbar-right">
                <li style="padding-top:8px;">
                    <div class="btn-group">
                        <button type="button" class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown">
                            <i class="glyphicon glyphicon-user"></i> ${sessionScope.user.username} <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
                            <li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
                            <li class="divider"></li>
                            <li><a href="login.html"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
                        </ul>
                    </div>
                </li>
                <li style="margin-left:10px;padding-top:8px;">
                    <button type="button" class="btn btn-default btn-danger">
                        <span class="glyphicon glyphicon-question-sign"></span> 帮助
                    </button>
                </li>
            </ul>
            <form class="navbar-form navbar-right">
                <input type="text" class="form-control" placeholder="Search...">
            </form>
        </div>
    </div>
</nav>

<div class="container-fluid">
    <div class="row">
        <div class="col-sm-3 col-md-2 sidebar">
            <div class="tree">
                <ul style="padding-left:0px;" class="list-group">
                    <li class="list-group-item tree-closed" >
                        <a href="main.html"><i class="glyphicon glyphicon-dashboard"></i> 控制面板</a>
                    </li>
                    <li class="list-group-item">
                        <span><i class="glyphicon glyphicon glyphicon-tasks"></i> 权限管理 <span class="badge" style="float:right">3</span></span>
                        <ul style="margin-top:10px;">
                            <li style="height:30px;">
                                <a href="userController/toUserList.htm" style="color:#e6d6ff;"><i class="glyphicon glyphicon-user"></i> 用户维护</a>
                            </li>
                            <li style="height:30px;">
                                <a href="role.html"><i class="glyphicon glyphicon-certificate"></i> 角色维护</a>
                            </li>
                            <li style="height:30px;">
                                <a href="permission.html"><i class="glyphicon glyphicon-lock"></i> 许可维护</a>
                            </li>
                        </ul>
                    </li>
                    <li class="list-group-item tree-closed">
                        <span><i class="glyphicon glyphicon-ok"></i> 业务审核 <span class="badge" style="float:right">3</span></span>
                        <ul style="margin-top:10px;display:none;">
                            <li style="height:30px;">
                                <a href="auth_cert.html"><i class="glyphicon glyphicon-check"></i> 实名认证审核</a>
                            </li>
                            <li style="height:30px;">
                                <a href="auth_adv.html"><i class="glyphicon glyphicon-check"></i> 广告审核</a>
                            </li>
                            <li style="height:30px;">
                                <a href="auth_project.html"><i class="glyphicon glyphicon-check"></i> 项目审核</a>
                            </li>
                        </ul>
                    </li>
                    <li class="list-group-item tree-closed">
                        <span><i class="glyphicon glyphicon-th-large"></i> 业务管理 <span class="badge" style="float:right">7</span></span>
                        <ul style="margin-top:10px;display:none;">
                            <li style="height:30px;">
                                <a href="cert.html"><i class="glyphicon glyphicon-picture"></i> 资质维护</a>
                            </li>
                            <li style="height:30px;">
                                <a href="type.html"><i class="glyphicon glyphicon-equalizer"></i> 分类管理</a>
                            </li>
                            <li style="height:30px;">
                                <a href="process.html"><i class="glyphicon glyphicon-random"></i> 流程管理</a>
                            </li>
                            <li style="height:30px;">
                                <a href="advertisement.html"><i class="glyphicon glyphicon-hdd"></i> 广告管理</a>
                            </li>
                            <li style="height:30px;">
                                <a href="message.html"><i class="glyphicon glyphicon-comment"></i> 消息模板</a>
                            </li>
                            <li style="height:30px;">
                                <a href="project_type.html"><i class="glyphicon glyphicon-list"></i> 项目分类</a>
                            </li>
                            <li style="height:30px;">
                                <a href="tag.html"><i class="glyphicon glyphicon-tags"></i> 项目标签</a>
                            </li>
                        </ul>
                    </li>
                    <li class="list-group-item tree-closed" >
                        <a href="param.html"><i class="glyphicon glyphicon-list-alt"></i> 参数管理</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
            <ol class="breadcrumb">
                <li><a href="#">首页</a></li>
                <li><a href="#">数据列表</a></li>
                <li class="active">新增</li>
            </ol>
            <div class="panel panel-default">
                <div class="panel-heading">表单数据<div style="float:right;cursor:pointer;" data-toggle="modal" data-target="#myModal"><i class="glyphicon glyphicon-question-sign"></i></div></div>
                <div class="panel-body">
                    <form id="addForm">
                        <div class="form-group">
                            <label for="floginacct">登陆账号</label>
                            <input type="text" class="form-control" id="floginacct" placeholder="请输入登陆账号">
                        </div>
                        <div class="form-group">
                            <label for="fusername">用户名称</label>
                            <input type="text" class="form-control" id="fusername" placeholder="请输入用户名称">
                        </div>
                        <div class="form-group">
                            <label for="femail">邮箱地址</label>
                            <input type="email" class="form-control" id="femail" placeholder="请输入邮箱地址">
                            <p class="help-block label label-warning">请输入合法的邮箱地址, 格式为： xxxx@xxxx.com</p>
                        </div>
                        <button id="addButton" type="Button" class="btn btn-success"><i class="glyphicon glyphicon-plus"></i> 新增</button>
                        <button id="resetButton" type="Button" class="btn btn-danger"><i class="glyphicon glyphicon-refresh"></i> 重置</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title" id="myModalLabel">帮助</h4>
            </div>
            <div class="modal-body">
                <div class="bs-callout bs-callout-info">
                    <h4>测试标题1</h4>
                    <p>测试内容1，测试内容1，测试内容1，测试内容1，测试内容1，测试内容1</p>
                </div>
                <div class="bs-callout bs-callout-info">
                    <h4>测试标题2</h4>
                    <p>测试内容2，测试内容2，测试内容2，测试内容2，测试内容2，测试内容2</p>
                </div>
            </div>
            <!--
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
              <button type="button" class="btn btn-primary">Save changes</button>
            </div>
            -->
        </div>
    </div>
</div>
<script src="jquery/jquery-2.1.1.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="script/docs.min.js"></script>
<script type="text/javascript" src="jquery/layer/layer.js"></script>
<script type="text/javascript">
    $(function () {
        $(".list-group-item").click(function(){
            if ( $(this).find("ul") ) {
                $(this).toggleClass("tree-closed");
                if ( $(this).hasClass("tree-closed") ) {
                    $("ul", this).hide("fast");
                } else {
                    $("ul", this).show("fast");
                }
            }
        });
    });
    var adding = -1;
    $("#addButton").click(function () {
        var floginacct =$("#floginacct");
        var fusername =$("#fusername");
        var femail =$("#femail");

        if ($.trim(floginacct.val())==""){
            layer.msg("账号不能为空!", {time:1000, icon:5, shift:6}, function () {
                floginacct.val("");
                floginacct.focus();
            });
            return false;
        }
        if ($.trim(fusername.val())==""){
            layer.msg("用户名不能为空!", {time:1000, icon:5, shift:6}, function () {
                fusername.val("");
                fusername.focus();
            });
            return false;
        }
        if ($.trim(femail.val())==""){
            layer.msg("邮箱不能为空!", {time:1000, icon:5, shift:6}, function () {
               femail.val("");
               femail.focus();
            });
            return false;
        }
        $.ajax( {
            type : "POST",
            url : "userController/doAddUser",
            data : {
                "loginacct" : floginacct.val(),
                "username" : fusername.val(),
                "email" : femail.val(),
            },
            beforeSend : function () {
                adding = layer.msg('Loading', {icon: 16});
                return true;
            },
            success : function (result) {
                layer.close(adding);
                if (result.success){
                    layer.msg("添加成功！", {time:1000, icon:6, shift:6});
                    window.location.href="userController/toUserList.htm";
                }else {
                    layer.msg("添加失败！", {time:1000, icon:5, shift:6});
                }
            },
            error : function (result) {
                layer.msg(result.message, {time:4000, icon:5, shift:6});
            },
        });
    });

    $("#resetButton").click(function () {
        $("#addForm")[0].reset();
    });
</script>
</body>
</html>

4、编写userController的添加处理方法

 /**
     * 处理用户添加
     * @param user
     * @return
     */
    @RequestMapping(value = "/doAddUser")
    public @ResponseBody Object doAddUser(User user){
        AjaxResult result = new AjaxResult();
        try {
            int i = userService.insert(user);
            System.out.println(i);
            if (i==1){
                result.setSuccess(true);
            }else{
                result.setSuccess(false);
            }
        }catch (Exception e){
            e.printStackTrace();
            result.setSuccess(false);
            result.setMessage("出现异常，请重新尝试！");
        }
        return result;
    }

5、完善service层的处理方法

public int insert(User user) {
        //生成事件
        Date date = new Date();
        SimpleDateFormat dateFormat = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
        String format = dateFormat.format(date);
        user.setCreatetime(format);
        //生成默认密码
        user.setUserpswd(MD5Util.digest("123"));
        return userMapper.insert(user);
    }

6、启动服务器查看效果
在这里插入图片描述

用户的修改

修改流程图
在这里插入图片描述
实现流程
1、在所有的用户的修改按钮中添加跳转路径。

2、在userController中添加方法接收删除用户的id，并将用户查出和修改页面一起返回。

/**
     * 返回更新用户页面
     * @return
     */
    @RequestMapping(value = "/toUpdateUser")
    public String toUpdateUser(Integer id,Map<String,User> map){
        System.out.println(id);
        User updateUser = userService.selectByPrimaryKey(id);
        System.out.println(updateUser);
        map.put("updateUser",updateUser);
        return "user/updateUser";
    }

3、新建updateUser.jsp文件，并编写异步请求方法提交修改数据。
updateUser.jsp页面内容

<%--
  Created by IntelliJ IDEA.
  User: 黄彬
  Date: 2020/6/5
  Time: 10:14
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<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">
    <meta name="description" content="">
    <meta name="author" content="">

    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/font-awesome.min.css">
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" href="css/doc.min.css">
    <style>
        .tree li {
            list-style-type: none;
            cursor:pointer;
        }
    </style>
</head>

<body>

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container-fluid">
        <div class="navbar-header">
            <div><a class="navbar-brand" style="font-size:32px;" href="user.html">众筹平台 - 用户维护</a></div>
        </div>
        <div id="navbar" class="navbar-collapse collapse">
            <ul class="nav navbar-nav navbar-right">
                <li style="padding-top:8px;">
                    <div class="btn-group">
                        <button type="button" class="btn btn-default btn-success dropdown-toggle" data-toggle="dropdown">
                            <i class="glyphicon glyphicon-user"></i> ${sessionScope.user.username} <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="#"><i class="glyphicon glyphicon-cog"></i> 个人设置</a></li>
                            <li><a href="#"><i class="glyphicon glyphicon-comment"></i> 消息</a></li>
                            <li class="divider"></li>
                            <li><a href="login.html"><i class="glyphicon glyphicon-off"></i> 退出系统</a></li>
                        </ul>
                    </div>
                </li>
                <li style="margin-left:10px;padding-top:8px;">
                    <button type="button" class="btn btn-default btn-danger">
                        <span class="glyphicon glyphicon-question-sign"></span> 帮助
                    </button>
                </li>
            </ul>
            <form class="navbar-form navbar-right">
                <input type="text" class="form-control" placeholder="Search...">
            </form>
        </div>
    </div>
</nav>

<div class="container-fluid">
    <div class="row">
        <div class="col-sm-3 col-md-2 sidebar">
            <div class="tree">
                <ul style="padding-left:0px;" class="list-group">
                    <li class="list-group-item tree-closed" >
                        <a href="main.html"><i class="glyphicon glyphicon-dashboard"></i> 控制面板</a>
                    </li>
                    <li class="list-group-item">
                        <span><i class="glyphicon glyphicon glyphicon-tasks"></i> 权限管理 <span class="badge" style="float:right">3</span></span>
                        <ul style="margin-top:10px;">
                            <li style="height:30px;">
                                <a href="userController/toUserList.htm" style="color:red;"><i class="glyphicon glyphicon-user"></i> 用户维护</a>
                            </li>
                            <li style="height:30px;">
                                <a href="role.html"><i class="glyphicon glyphicon-certificate"></i> 角色维护</a>
                            </li>
                            <li style="height:30px;">
                                <a href="permission.html"><i class="glyphicon glyphicon-lock"></i> 许可维护</a>
                            </li>
                        </ul>
                    </li>
                    <li class="list-group-item tree-closed">
                        <span><i class="glyphicon glyphicon-ok"></i> 业务审核 <span class="badge" style="float:right">3</span></span>
                        <ul style="margin-top:10px;display:none;">
                            <li style="height:30px;">
                                <a href="auth_cert.html"><i class="glyphicon glyphicon-check"></i> 实名认证审核</a>
                            </li>
                            <li style="height:30px;">
                                <a href="auth_adv.html"><i class="glyphicon glyphicon-check"></i> 广告审核</a>
                            </li>
                            <li style="height:30px;">
                                <a href="auth_project.html"><i class="glyphicon glyphicon-check"></i> 项目审核</a>
                            </li>
                        </ul>
                    </li>
                    <li class="list-group-item tree-closed">
                        <span><i class="glyphicon glyphicon-th-large"></i> 业务管理 <span class="badge" style="float:right">7</span></span>
                        <ul style="margin-top:10px;display:none;">
                            <li style="height:30px;">
                                <a href="cert.html"><i class="glyphicon glyphicon-picture"></i> 资质维护</a>
                            </li>
                            <li style="height:30px;">
                                <a href="type.html"><i class="glyphicon glyphicon-equalizer"></i> 分类管理</a>
                            </li>
                            <li style="height:30px;">
                                <a href="process.html"><i class="glyphicon glyphicon-random"></i> 流程管理</a>
                            </li>
                            <li style="height:30px;">
                                <a href="advertisement.html"><i class="glyphicon glyphicon-hdd"></i> 广告管理</a>
                            </li>
                            <li style="height:30px;">
                                <a href="message.html"><i class="glyphicon glyphicon-comment"></i> 消息模板</a>
                            </li>
                            <li style="height:30px;">
                                <a href="project_type.html"><i class="glyphicon glyphicon-list"></i> 项目分类</a>
                            </li>
                            <li style="height:30px;">
                                <a href="tag.html"><i class="glyphicon glyphicon-tags"></i> 项目标签</a>
                            </li>
                        </ul>
                    </li>
                    <li class="list-group-item tree-closed" >
                        <a href="param.html"><i class="glyphicon glyphicon-list-alt"></i> 参数管理</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
            <ol class="breadcrumb">
                <li><a href="#">首页</a></li>
                <li><a href="#">数据列表</a></li>
                <li class="active">修改</li>
            </ol>
            <div class="panel panel-default">
                <div class="panel-heading">表单数据<div style="float:right;cursor:pointer;" data-toggle="modal" data-target="#myModal"><i class="glyphicon glyphicon-question-sign"></i></div></div>
                <div class="panel-body">
                    <form id="updateForm">
                        <div class="form-group">
                            <label for="floginacct">登陆账号</label>
                            <input type="text" class="form-control" id="floginacct" value="${updateUser.loginacct}">
                        </div>
                        <div class="form-group">
                            <label for="fusername">用户名称</label>
                            <input type="text" class="form-control" id="fusername" value="${updateUser.username}">
                        </div>
                        <div class="form-group">
                            <label for="femail">邮箱地址</label>
                            <input type="email" class="form-control" id="femail" value="${updateUser.email}">
                            <p class="help-block label label-warning">请输入合法的邮箱地址, 格式为： xxxx@xxxx.com</p>
                        </div>
                        <button id="modifyButton" type="button" class="btn btn-success"><i class="glyphicon glyphicon-edit"></i> 修改</button>
                        <button id="resetButton" type="button" class="btn btn-danger"><i class="glyphicon glyphicon-refresh"></i> 重置</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title" id="myModalLabel">帮助</h4>
            </div>
            <div class="modal-body">
                <div class="bs-callout bs-callout-info">
                    <h4>测试标题1</h4>
                    <p>测试内容1，测试内容1，测试内容1，测试内容1，测试内容1，测试内容1</p>
                </div>
                <div class="bs-callout bs-callout-info">
                    <h4>测试标题2</h4>
                    <p>测试内容2，测试内容2，测试内容2，测试内容2，测试内容2，测试内容2</p>
                </div>
            </div>
            <!--
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
              <button type="button" class="btn btn-primary">Save changes</button>
            </div>
            -->
        </div>
    </div>
</div>
<script src="jquery/jquery-2.1.1.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="script/docs.min.js"></script>
<script type="text/javascript" src="jquery/layer/layer.js"></script>
<script type="text/javascript">
    $(function () {
        $(".list-group-item").click(function(){
            if ( $(this).find("ul") ) {
                $(this).toggleClass("tree-closed");
                if ( $(this).hasClass("tree-closed") ) {
                    $("ul", this).hide("fast");
                } else {
                    $("ul", this).show("fast");
                }
            }
        });
    });

    $("#modifyButton").click(function () {

        var floginacct =$("#floginacct");
        var fusername =$("#fusername");
        var femail =$("#femail");

        if ($.trim(floginacct.val())==""){
            layer.msg("账号不能为空!", {time:1000, icon:5, shift:6}, function () {
                floginacct.val("");
                floginacct.focus();
            });
            return false;
        }
        if ($.trim(fusername.val())==""){
            layer.msg("用户名不能为空!", {time:1000, icon:5, shift:6}, function () {
                fusername.val("");
                fusername.focus();
            });
            return false;
        }
        if ($.trim(femail.val())==""){
            layer.msg("邮箱不能为空!", {time:1000, icon:5, shift:6}, function () {
                femail.val("");
                femail.focus();
            });
            return false;
        }

        $.ajax( {
            type : "POST",
            url : "userController/doUpdateUser.do",
            data : {
                "loginacct" : floginacct.val(),
                "username" : fusername.val(),
                "email" : femail.val(),
                "id" : "${updateUser.id}",
             },
            beforeSend : function () {
                adding = layer.msg('Loading', {icon: 16});
                return true;
            },
            success : function (result) {
                layer.close(adding);
                if (result.success){
                    layer.msg("修改成功！", {time:1000, icon:6, shift:6});
                    window.location.href="userController/toUserList.htm";
                }else {
                    layer.msg("修改失败！", {time:1000, icon:5, shift:6});
                }
            },
            error : function (result) {
                layer.msg(result.message, {time:4000, icon:5, shift:6});
            },
        });
    });

    $("#resetButton").click(function () {
        $("#updateForm")[0].reset();
    });

</script>
</body>
</html>

4、接收用户数据并进行修改，并返回结果。

 /**
     * 处理用户修改
     * @param user
     * @return
     */
    @RequestMapping(value = "/doUpdateUser")
    public @ResponseBody Object doUpdateUser(User user){
        AjaxResult result = new AjaxResult();
        try{
            int i = userService.updateByPrimaryKey(user);
            if (i==1){
                result.setSuccess(true);
            }else{
                result.setSuccess(false);
            }
        }catch (Exception e){
            e.printStackTrace();
            result.setSuccess(false);
            result.setMessage("修改出错，请重新尝试！！！");
        }
        return result;
    }

5、完善service层和Mapper映射问价的sql语句

public int updateByPrimaryKey(User user) {
        return userMapper.updateByPrimaryKey(user);
    }

<update id="updateByPrimaryKey" parameterType="com.bin.crowdfunding.bean.User" >
    update t_user
    set loginacct = #{loginacct,jdbcType=VARCHAR},
      username = #{username,jdbcType=VARCHAR},
      email = #{email,jdbcType=VARCHAR}
    where id = #{id,jdbcType=INTEGER}
  </update>

6、测试效果
在这里插入图片描述

用户的删除

在这里插入图片描述
先实现点击右边的按钮将用户删除
1、在userList.jsp中调用删除的异步请求函数。

content+='        <button type="button" οnclick="deleteUser('+user.id+',\''+user.username+'\')" class="btn btn-danger btn-xs"><i class=" glyphicon glyphicon-remove"></i></button>';

2、编写异步请求函数体。

function deleteUser(id,loginacct) {

        layer.confirm("确认要删除[" + loginacct + "]吗?", {icon: 3, title: '提示'}, function (cindex) {
            layer.close(cindex);
            $.ajax({
               type : "post",
               url : "userController/doDeleteUser.do",
                data : {
                   "id" : id,
                },
                beforeSend : function () {
                    return true;
                },
                success :function (result) {
                    if (result.success){
                        layer.msg("删除成功！", {time:1000, icon:6, shift:6}); //弹出时间，图标，特效
                        window.location.href="userController/toUserList.htm";
                    }else {
                        layer.msg("删除失败！", {time:1000, icon:5, shift:6}); //弹出时间，图标，特效
                    }
                },
                error : function (result) {
                    layer.msg(result.message, {time:1000, icon:5, shift:6}); //弹出时间，图标，特效
                }
            });
        },function (cindex) {
            layer.close(cindex);
        });
    }

3、编写异步请求对应的处理方法。

 /**
     * 处理用户删除
     * @param id
     * @return
     */
    @RequestMapping(value = "/doDeleteUser")
    public @ResponseBody Object doDeleteUser(Integer id){

        AjaxResult result = new AjaxResult();
        try {
            int i = userService.deleteByPrimaryKey(id);
            if (i==1){
                result.setSuccess(true);
            }else {
                result.setSuccess(false);
            }
        }catch (Exception e){
            e.printStackTrace();
            result.setSuccess(false);
            result.setMessage("删除出现异常，请重新尝试！");
        }
        return result;
    }

4、完善service层和Mapper映射文件后，启动服务器进行测试
在这里插入图片描述

实现多用户的批量删除
1、在全选框添加事件

2、编写事件处理

 //添加事件处理
    $("#allCheckbox").click(function () {
        //获取多选框的值
        var checkboxStatus = this.checked;
        //将多选框的值赋给单选框
        //$("tbody tr td input[type='checkbox']").attr("checked",checkboxStatus);
        $("tbody tr td input[type='checkbox']").prop("checked",checkboxStatus);
        });

3、编写删除按钮的异步请求处理

//添加按钮事件处理
    $("#deleteBatchUserButton").click(function () {

        //获取被选中的用户的id，被选中的才带checked属性
        var selectedCheckbox = $("tbody tr td input:checked");
        //判断用户长度
        if (selectedCheckbox.length==0){
            layer.msg("请选择删除的用户！", {time:1000, icon:5, shift:6}); //弹出时间，图标，特效
                return false;
            }

            //将选中的用户的id拼串

        var idStr="";
        $.each(selectedCheckbox,function (index,user) {
            if (index!=0){
                idStr += "&";
            }
            idStr += "id="+user.id;
        });

        //执行操作
        layer.confirm("确认要删除这些用户吗?", {icon: 3, title: '提示'}, function (cindex) {
            layer.close(cindex);
            $.ajax({
                type : "post",
                url : "userController/doDeleteBatchUser.do",
                data : idStr,
                beforeSend : function () {
                    return true;
                },
                success :function (result) {
                    if (result.success){
                        layer.msg("删除成功！", {time:1000, icon:6, shift:6}); //弹出时间，图标，特效
                        window.location.href="userController/toUserList.htm";
                    }else {
                        layer.msg("删除失败！", {time:1000, icon:5, shift:6}); //弹出时间，图标，特效
                    }
                },
                error : function (result) {
                    layer.msg(result.message, {time:1000, icon:5, shift:6}); //弹出时间，图标，特效
                }
            });
        },function (cindex) {
            layer.close(cindex);
        });
        });

4、实现userController对应的处理方法。

/**
     * 批量删除用户
     * @param id
     * @return
     */
    @RequestMapping(value = "/doDeleteBatchUser")
    public @ResponseBody Object doDeleteBatchUser(Integer[] id){
        AjaxResult result = new AjaxResult();
        int sum = 0;
        try {
            for (Integer integer : id) {
                int count = userService.deleteByPrimaryKey(integer);
                sum += count;
            }
            if (sum==id.length){
                result.setSuccess(true);
            }else {
                result.setSuccess(false);
            }
        }catch (Exception e){
            e.printStackTrace();
            result.setMessage("出现异常，请重新尝试！");
            result.setSuccess(false);
        }
        return result;
    }

5、测试效果
在这里插入图片描述

阿粉online

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
众筹网站项目第五天之用户的增、删、改

打开原教程视频注：本人是渣渣，有错请谅解。增加用户流程：点击新增按钮->跳转至用户信息填写页面->点击添加将数据保存到后台服务器并转到用户列表。1、在userList.jsp的新增按钮添加跳转链接2、在userController中添加方法返回指定的jsp页面 /** * 返回新增用户页面 * @return */ @RequestMapping(value = "/toAddUser") public String toAddUs
复制链接

扫一扫

专栏目录