初学JavaWeb-SSM框架实现增删改查——查_用ssm框架写增删改查-CSDN博客

本文链接：https://blog.csdn.net/qq_36795035/article/details/79234663

查

前端代码：

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<html>
<head>
    <title>mmp</title>
    <script src="../static/js/jquery-3.3.1.min.js"></script>
</head>
<body>
<form id="Login_form">
    <input placeholder="请输入用户名" name="user" id="user" type="text">
    <input placeholder="请输入密码" name="password" id="password" type="password" maxlength="8">
    <a id="Login_add" href="javascript:void(0);">注册</a>
</form>
<form id="Login_form_del">
    <input placeholder="请输入你要删除的用户名" name="user" id="del_user" type="text">
    <input placeholder="请输入你要删除的密码" name="password" id="del_password" type="password">
    <a id="Login_del" href="javascript:void (0);">删除</a>
    <a id="Login_del_two" href="javascript:void (0);">牛皮删除</a>
</form>
<form id="login_form_update">
    <input placeholder="请输入老用户名" name="oldName" type="text">
    <input placeholder="请输入新用户名" name="newName" type="text">
    <a id="login_update_btn" href="javascript:void (0);">修改</a>
</form>

    <a id="login_search" href="javascript:void (0);">查找</a>

<table>
    <c:forEach items="${userList}" var="f">
        <tr>
            <td>
                    ${f.user}
            </td>
            <td>
                    ${f.password}
            </td>
        </tr>
    </c:forEach>
</table>
<script>
    /*
    这是错误的思路和代码，引以为戒
    window.οnlοad= function(){
            $.ajax({
                url:'/demo4/demo/find',
                success:function (data) {
                        alert(1);
                }
            })
        }
      */
    //查找
    $('#login_search').click(function(){
        window.location.href="/demo4/demo/find";
    });


        //更新
    $('#login_update_btn').click(function () {
        $.ajax({
            url: '/demo4/demo/update',        //      /项目名/控制器映射/方法映射
            data: $('#login_form_update').serialize(),
            success: function (data) {
                alert("修改成功");
            }
        })
    })

    //注册
    $('#Login_add').click(function () {
        $.ajax({
            url: '/demo4/demo/add',        //      /项目名/控制器映射/方法映射
            data: $('#Login_form').serialize(),
            success: function (data) {
                if (data == "success") {
                    alert("注册成功");
                } else {
                    alert("注册失败");
                }
            }
        })
    })
    //删除
    $('#Login_del').click(function () {
        $.ajax({
            url: '/demo4/demo/del',
            data: $('#Login_form_del').serialize(),
            success: function (data) {
                if (data == "success") {
                    alert("删除成功");
                } else {
                    alert("删除失败");
                }
            }
        })
    })

    //删除两个
    $('#Login_del_two').click(function () {
        $.ajax({
            url: '/demo4/demo/del_two',
            data: $('#Login_form_del').serialize(),
            success: function (data) {
                if (data == "success") {
                    alert("成功删除");
                }
            }
        })
    })
</script>
</body>

</html>

几个注意的地方：

（一）c:forEach是属于JSTL的，要注意导入库。c:forEach示例如下:

<c:forEach var="每个变量名字"   items="要迭代的list"   varStatus="每个对象的状态"

                           begin="循环从哪儿开始"    end="循环到哪儿结束"    step="循环的步长">

                              循环要输出的东西
</c:forEach>

（二）一般要用ajax方法的，都是@ResponseBody接返回的值，由于我错误的使用了ajax方法，导致我一直没显示数据苦恼了一晚上。基础还是很重要的。

后端代码：

package com.xudan.demo4.controller;
import com.xudan.demo4.mapper.UserMapper;
import com.xudan.demo4.pojo.User;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import java.util.List;
import java.util.UUID;

@Controller
@RequestMapping("/demo")        //控制器映射
public class DemoController {
    @Autowired          //自动装配
    private UserMapper userMapper;




    //重定向指向的方法，用来进行跳转到INF内的index.jsp
    @RequestMapping("index")
    public String index(Model model){
        List<User> userList = userMapper.selectAll(new User());
        model.addAttribute("userList", userList);
        return "index";
    }


    @RequestMapping("add")      //方法映射
    @ResponseBody
    public String add(User user) {
        //随机ID
        user.setId(UUID.randomUUID().toString().replace("-", ""));
        if(user.getUser().length()!=0 && user.getPassword().length()!=0){       //判断用户名和密码是否空
            userMapper.insert(user);                                            //向数据库里加入内容
            return "success";
        }else {
            return "fail";
        }
    }

    @RequestMapping("del")
    @ResponseBody
    public String del(User user){
        userMapper.deleteByName(user);              // deleteByName是自己定义的方法
        return "success";
    }

    @RequestMapping("del_two")
    @ResponseBody
    public String del_two(User user){
        userMapper.deleteByNameAndPassword(user);
        return "success";
    }

  /*  @RequestMapping("find")
    @ResponseBody
    public String find(User user){
        if(user.getUser()==null || user.getUser().equals("")){
            return "fail";
        }
        if(user.getPassword()==null || user.getPassword().equals("")){
            return "fail";
        }
       List<User> users = userMapper.selectAll(user);
        if(users.size()>0){
            return "success";
        }else {
            return "fail";
        }
    }*/

    //修改更新
    @RequestMapping("update")
    public String update(String oldName,String newName){
        userMapper.updateByName(oldName,newName);
        return "index";
    }

    //查
    @RequestMapping("find")
    public String find(Model model) {
       /* 根据条件查找
        User user = new User();
        user.setUser("zc");
        */
        List<User> userList = userMapper.selectAll(new User());     //实例化一个User空对象
        model.addAttribute("userList", userList);               //将userList放入model传给前端
        System.out.println(userList);
        return "index";
    }

//    @RequestMapping("load")
//    @ResponseBody
//    public String load(User user){
//        List<User> users = userMapper.selectAll(user);
//
//        if (users.size() > 0) {
//            return "success";
//        } else {
//            return "fail";
//        }
//    }
}

几个注意的地方：

（一）页面尽量放在INF文件夹中，因为INF文件夹中的页面不能直接被访问，需要控制器跳转，所以会更加安全

重定向代码如下:

<%
response.sendRedirect("/demo4/demo/index");
%>

如果要根据特定的条件来查找，代码如下：

    @RequestMapping("find")
    public String find(Model model) {
        User user = new User();
        user.setUser("zc");
        List<User> userList = userMapper.selectAll(user);     
        model.addAttribute("userList", userList);               //将userList放入model传给前端
        return "index";
    }

如果User为空的情况下就是查所有，否则按照条件查找