mybatis+Servlet+BootStrap+maven 整合 处理CURD

mybatis  的配置： 

1、首先我门需要写一个数据源文件 ----》jdbc.properties

 2、写mybatis 中心配置文件：（配置文件可以在网上找，根据自己的东西稍加修改就行）

 

 下面是我根据自己的项目来改的配置文件

注意： 1，2，3 

标1 ： properties  ->配置数据源

typeAliases --->配置别名  name= （实体类的路径 ）： 作用体现映射mapper 文件中。

3，sql语句的映射文件

映射mapper 文件也可以在网上找，和mybatis在一个地方， 如下：

 也要根据 自己的 项目进行改造，关于 文件的解释如下：

namespace -》 写的是 我mapper接口的路径

下面的 查询语句， id 对应mapper 接口的方法 ，必须要与方法名一致， resultType 是返回值类型 ，如过 配置别名在这里起作用 ： 比如 我的实体类的路径是：cn.dxy.pojo，如果不配置别名，在resultTypen="cn.dxy.pojo.student" ,配置了别名就可以写成student 不用，或者Student 不（区别）大小写， 如下 根据我的项目需要写的curd。

映射文件需要有对应的接口类，代码内容：

<mapper namespace="cn.dxy.mapper.StudentMapper">
我们需要定义一个接口StudentMapper.class  ,写接口方法，不需要去新建一个类去实现这个接口，  获取数据库数据的步骤如下。

 4、通过mybatis 获取数据库的数据

 第一步：获取SqlSessionFactory 对象（在网页上有模板，参照上述网址）

第二步 获取SqlSession 对象 ，通过sqlSessionFactory 提供的openSession(true);

第三步：获取StudentMapper 实例， 实例对象可以的通过映射文件对数据库的方法进访问

 mybatis的总结如上 ：到这里我们就能从数据库获取数据了 ，接下来要做的是将数据放入到网页中去，

2、制作网页（使用bootstrap框架）

注： 很长一段时间 ，因该是没真正认识到前端框架之前，我一直多觉得写前端页面是靠自己一个个标签敲出来的，也正因为如词所以觉得前端非常的无聊，以至于很长一段时间抵触学习前端（简直傻逼）。

第一步使用bootStrap 的准备

 页面布局可以从官网上获取 ，官网如图：

 根据需要复制代码，然乎根据自己的需要更改代码结构：

第二步 我们需要将查询到的学生列表展示在网页上，所有我们同过EL 表达式：代码如下

    <c:forEach items="${studentList}" var="stu">
                <tr>
                    <td>${stu.sid}</td>
                    <td>${stu.sname}</td>
                    <td>${stu.sex}</td>
                    <td>${stu.age}</td>
                    <td>${stu.addr}</td>
                    <td>${stu.cname}</td>
                    <td>
                        <a href="" class="btn btn-success btn-sm" onclick="updateUI(${stu.sid},'${stu.sname}','${stu.sex}',${stu.age},'${stu.addr}',${stu.cid})" data-toggle="modal" data-target="#myModal">修改</a>
                        <a href="" class="btn btn-danger btn-sm" onclick="delStudent(${stu.sid})"> 删除学生</a>
                    </td>
                </tr>
</c:forEach>

通过这段代码可以将前端传过来的值通过foreach循环展示在网页上，

注意代码;  如何将值放到每一行 ${stu.sid}  还有关于函数的使用 ：

第三步 ：javascript 内容：

<script>
    function  delStudent(sid){
            if (confirm("你真的要删除该学生")){
                location.href = "/student?cmd=delete&sid="+sid;
            }
    }
    function save(){
        let sid =$("#sid").val()  //获取sid的值
        console.log("save",sid)
        let url=""
        if(sid){
            url="/student?cmd=update"
        }else{
            url="/student?cmd=add"
        }
        //1.3 为表单的action属性赋值
        document.forms[0].action = url;
        //1.4 提交表单
        document.forms[0].submit();

    }
    function addUI(){

        // 根据id得到sid的值
        $("#myTitle").html("添加学生")

        // $("#sid").val()  //为隐藏属性赋值
        // $("#sname").val()
        // $("#age").val()
        // $("#addr").val()
        // $("#cid").val()
        // $("#sex1").prop("checked",true);
        // $("#sex2").prop("checked",false);
        //2.2 重置表单  上面是为每一个表单的对话框赋空值，reset() 方法一步到位
        document.forms[0].reset();
    }

    function  updateUI(sid,sname,sex,age,addr,cid){
        //判断是否取到了值
        console.log(sid,sname,sex,age,addr,cid);
        //将值写入到对话框中
        $("#sid").val(sid)  //为隐藏属性赋值
        $("#sname").val(sname)
        $("#age").val(age)
        $("#addr").val(addr)
        $("#cid").val(cid)

        if(sex=='男'){
            $("#sex1").prop("checked",true);
        }else{
            $("#sex2").prop("checked",true);
        }
            $("#myTitle").html("修改学生")
    }

这里面有 方法的申明 ，通过操作标签的属性，还有表单地址提交写道js代码中 等等 ，自己理解

注 ：前端对我来说是比较薄弱的，所以对于操作网页文档 ，及js代码我首先回去记住如何去操作文本文档，所以我贴出来整个代码块。

到目前为止 ，数据库的数据已经能拿到了，前端页面也已经准备好了。我们需要将后端数据放入到前端页面中，需要个中间方，及  servlet

3、将数据库数据放入到前端页面: servlet （后续我们会是由springmvc 将servlet 替换掉）

/**
 * @author: dxy
 * @description:
 * @Date:2021/11/18
 */
@WebServlet("/student")
public class StudentServlet extends HttpServlet {
    private StudentService studentService;
    private ClassesService classesService;

    @Override
    public void init() throws ServletException {
        studentService = new StudentServiceImpl();
        classesService = new ClassesServiceImpl();
    }


    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws IOException, ServletException {
        //0. 处理post请求的中文乱码
        req.setCharacterEncoding("UTF-8");
//        通过前端传过来的数据来判断用户的操作，获取到的是地址栏的数据
        String cmd = req.getParameter("cmd");
        if (cmd.equals("list")){
            list(req, resp);
            System.out.println("查询出来");
        }else if(cmd.equals("update")){
            System.out.println("更新");
            update(req,resp);
        }else if(cmd.equals("add")){
            add(req,resp);
        }else if(cmd.equals("delete")){
            delete(req,resp);
        }
    }
// 获取学生列表通过el表达是中  注意    req.setAttribute("studentList",studentList);  要和前端
    private void  list(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //查询所有学生
        List<Student> studentList= studentService.findAllStudent();
        //将学生列表放到作用域中
        req.setAttribute("studentList",studentList);
        //查询班级列表
        List<Classes> classesList= classesService.findAllClasses();
        //将查询到班级列表放到作用域中
        req.setAttribute("classesList",classesList);
        //进行页面的转发
        req.getRequestDispatcher("/WEB-INF/student/student.jsp").forward(req,resp);
    }
    //更新数据库中的信息
    private void update(HttpServletRequest req, HttpServletResponse resp) {
//     创建Student对象来保存form表单的数据
        Student student =new Student();
        try {
            //将前端获取到的关于学生的数据保存在Student对象中
            BeanUtils.populate(student,req.getParameterMap());
            studentService.updateStudent(student);
            resp.sendRedirect("/student?cmd=list");
        }catch (Exception e ){
            e.printStackTrace();
        }

    }
    private void delete(HttpServletRequest req, HttpServletResponse resp) throws IOException {
        //获取前端数据（这个实在页面中的数据）
        int sid =Integer.parseInt(req.getParameter("sid")) ;
        System.out.println("sid = " + sid);
        studentService.deleteStudent(sid);
        resp.sendRedirect("/student?cmd=list");
    }

    private void add(HttpServletRequest req, HttpServletResponse resp) {
        Student student =new Student();
        try {
//            获取前端的数据保存在student的对象实例中
            BeanUtils.populate(student,req.getParameterMap());
            studentService.addStudent(student);
            //重定向
            resp.sendRedirect("student?cmd=list");
        }catch (Exception e ){
            e.printStackTrace();
        }
    }

注意的点

1、add（）方法和update（）方法获取前端表单数据使用的类和 类提供的方法，

2、转发重定向，

3、获取页面参数的值、和获取浏览器地址的参数，

4、 设置字符过滤器