Mac下，IntelliJ IDEA+maven+tomcat，实现页面前后端分离及页面跳转(web开发第二课)

在上一篇博客的基础之上，本篇博客实现页面前后端分离及页面跳转
1.首先，在web.xml下，标签之上，添加listener及context，如下：

 
  
    org.springframework.web.context.ContextLoaderListener
  
  
  
    contextConfigLocation
    /WEB-INF/configs/spring/applicationContext.xml
  

2.在configs下，新建一个spring文件夹，并新建一个XML文件，取名为applicationContext.xml

3. 开始写Java代码，业务层、服务层、控制层等
   3.1 在main目录Java目录下， 新建一个com.mvcdemo.pojo包，并新建一个student类

package com.mvcdemo.pojo;

/**
 * 功能描述:student的相关属性
 *
 * @ClassName: Student
 * @Author: Chentingxuan
 * @Date: 2019-02-28 20:05
 * @Version: V1.0
 */
public class Student {
    private Integer stuId;
    private String name;
    private String sex;
    private String phone;
    private String address;

    public Student() {
    }

    public Student(Integer stuId, String name, String sex, String phone, String address) {
        this.stuId = stuId;
        this.name = name;
        this.sex = sex;
        this.phone = phone;
        this.address = address;
    }


    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getSex() {
        return sex;
    }

    public void setSex(String sex) {
        this.sex = sex;
    }

    public String getPhone() {
        return phone;
    }

    public void setPhone(String phone) {
        this.phone = phone;
    }

    public String getAddress() {
        return address;
    }

    public void setAddress(String address) {
        this.address = address;
    }

    public Integer getStuId() {
        return stuId;
    }

    public void setStuId(Integer stuId) {
        this.stuId = stuId;
    }
}

3.2 在main目录Java目录下，新建一个com.mvcdemo.service包，并新建一个StudentService接口

package com.mvcdemo.service;

import com.mvcdemo.pojo.Student;

/**
 * 功能描述:student的服务层
 *
 * @ClassName: StudentService
 * @Author: Chentingxuan
 * @Date: 2019-02-28 20:02
 * @Version: V1.0
 */
public interface StudentService {
    /**
     * 根据学员ID获取学员信息
     * @param stuId 学员ID
     * @return 学员对象
     */
    Student selectByStuId(Integer stuId);
}

3.3 在main目录下的Java目录下，新建一个com.mvcdemo.service.impl包，并新建一个StudentServiceImpl.java用于实现StudentService接口

package com.mvcdemo.service.impl;

import com.mvcdemo.pojo.Student;
import com.mvcdemo.service.StudentService;
import org.springframework.stereotype.Service;

/**
 * 功能描述:实现StudentService接口
 *
 * @ClassName: StudentServiceImpl
 * @Author: Chentingxuan
 * @Date: 2019-02-28 20:13
 * @Version: V1.0
 */
@Service
public class StudentServiceImpl implements StudentService {

    public Student selectByStuId(Integer stuId) {
        Student stu = new Student();
        stu.setStuId(stuId);
        stu.setName("Tome");
        stu.setSex("male");
        stu.setPhone("13807311234");
        stu.setAddress("changsha");
        return stu;
    }
}

3.4 在controller包下，新建一个StudentController类，实现控制层

package com.mvcdemo.controller;

import com.mvcdemo.pojo.Student;
import com.mvcdemo.service.StudentService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.*;

import java.util.Map;


/**
 * 功能描述:student的控制层
 *
 * @ClassName: StudentController
 * @Author: Chentingxuan
 * @Date: 2019-02-28 20:20
 * @Version: V1.0
 */
@Controller
@RequestMapping("/student")
public class StudentController {
    @Autowired
    private StudentService studentService;

    /*
    浏览器地址，通过输入地址../view?stuId=**，来访问
     */
    @RequestMapping(value = "/view", method = RequestMethod.GET)
    public String viewStudent(@RequestParam("stuId") Integer stuId, Model model) {
        Student student;
        if(stuId != null) {
            student = studentService.selectByStuId(stuId);
        } else {
            student = new Student();
        }
        model.addAttribute(student);
        return "student/student_view";
    }

    /*
    浏览器地址，通过输入地址../view2/**，来访问
     */
    @RequestMapping(value = "/view2/{stuId}", method = RequestMethod.GET)
    public String viewStudent2(@PathVariable("stuId") Integer stuId, Map model) {
        Student student;
        if(stuId != null) {
            student = studentService.selectByStuId(stuId);
        } else {
            student = new Student();
        }
        model.put("student",student);
        return "student/student_view";
    }

    /*
    浏览器地址，通过输入地址../admin?add，来访问
     */
    @RequestMapping(value = "/admin", method = RequestMethod.GET, params = "add")
    public String createStudent() {
        return "student/student_edit";
    }

    /*
    通过页面请求来访问
     */
    @RequestMapping(value = "/save", method = RequestMethod.POST)
    public String saveStudent(Student student) {
        System.out.println("student = [" + student + "]");
        //添加保存的业务逻辑
        student.setStuId(123);
        //redirect：重定向，forward：转发
        return "redirect:view?stuId=" + student.getStuId();
    }

    /*
    浏览器地址，通过输入地址../viewByJson?stuId=**，来访问
     */
    @RequestMapping(value = "/viewByJson", method = RequestMethod.GET)
    public @ResponseBody Student viewStudentByJson(@RequestParam("stuId") Integer stuId) {
        Student student;
        if(stuId != null) {
            student = studentService.selectByStuId(stuId);
        } else {
            student = new Student();
        }
        return student;
    }
}

4. 接下来是jsp页面
   4.1 在jsps目录下面，新建一个student文件夹，并新建一个student_view.jsp

<%--
  Created by IntelliJ IDEA.
  User: chentingxuan
  Date: 2019-02-28
  Time: 20:46
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>


    


学员信息

编号：${student.stuId}

姓名：${student.name}

性别：${student.sex}

电话：${student.phone}

住址：${student.address}

4.2 在同样的目录结构下，新建一个student_edit.jsp

<%--
  Created by IntelliJ IDEA.
  User: chentingxuan
  Date: 2019-02-28
  Time: 20:46
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>


    


学生信息设置

    姓名：

    性别：

    电话：

    住址：

    

5.点击运行
5.1 首先是第一种方法来访问student_view.jsp页面

5.2 第二种方法来访问student_view.jsp页面

5.3 第三种方法，通过页面跳转来访问student_view.jsp页面
首先是跳转前的页面

点击提交按钮后，就会跳到相应的界面

5.4 这里添加了一个通过json来查看数据

源代码：完整代码