相关准备

和传统 CRUD 一样，实现对员工信息的增删改查。

  • 搭建环境
  • 准备实体类
public class Employee {

    private Integer id;

    private String lastName;

    private String email;

    //1 male, 0 female

    private Integer gender;

    //getter,setter,有参无参

}
  • 准备dao模拟数据
@Repository

public class EmployeeDao {

    private static Map<Integer, Employee> employees = null;

    static{

        employees = new HashMap<Integer, Employee>();

        employees.put(1001, new Employee(1001, "E-AA", "aa@163.com", 1));

        employees.put(1002, new Employee(1002, "E-BB", "bb@163.com", 1));

        employees.put(1003, new Employee(1003, "E-CC", "cc@163.com", 0));

        employees.put(1004, new Employee(1004, "E-DD", "dd@163.com", 0));

        employees.put(1005, new Employee(1005, "E-EE", "ee@163.com", 1));

    }

    private static Integer initId = 1006;

    public void save(Employee employee){

        if(employee.getId() == null){

            employee.setId(initId++);

        }

        employees.put(employee.getId(), employee);

    }

    public Collection<Employee> getAll(){

        return employees.values();

    }

    public Employee get(Integer id){

        return employees.get(id);

    }

    public void delete(Integer id){

        employees.remove(id);

    }

}

功能清单

功能 URL 地址 请求方式
访问首页√ / GET
查询全部数据√ /employee GET
删除√ /employee/2 DELETE
跳转到添加数据页面√ /toAdd GET
执行保存√ /employee POST
跳转到更新数据页面√ /employee/2 GET
执行更新√ /employee PUT

具体功能：访问首页

①配置view-controller

<mvc:view-controller path="/" view-name="index"/>

②创建页面

<!DOCTYPE html>

<html lang="en" xmlns:th="http://www.thymeleaf.org">

    <head>

        <meta charset="UTF-8" >

        <title>Title</title>

    </head>

    <body>

        <h1>首页</h1>

        <a th:href="@{/employee}">访问员工信息</a>

    </body>

</html>

具体功能：查询所有员工数据

①控制器方法

@RequestMapping(value = "/employee", method = RequestMethod.GET)

public String getEmployeeList(Model model){

    Collection<Employee> employeeList = employeeDao.getAll();

    model.addAttribute("employeeList", employeeList);

    return "employee_list";

}

②创建employee_list.html

<!DOCTYPE html>

<html lang="en" xmlns:th="http://www.thymeleaf.org">

    <head>

        <meta charset="UTF-8">

        <title>Employee Info</title>

        <script type="text/javascript" th:src="@{/static/js/vue.js}"></script>

    </head>

    <body>

        <table border="1" cellpadding="0" cellspacing="0" style="text-align:center;" id="dataTable">

            <tr>

                <th colspan="5">Employee Info</th>

            </tr>

            <tr>

                <th>id</th>

                <th>lastName</th>

                <th>email</th>

                <th>gender</th>

                <th>options(<a th:href="@{/toAdd}">add</a>)</th>

            </tr>

            <tr th:each="employee : ${employeeList}">

                <td th:text="${employee.id}"></td>

                <td th:text="${employee.lastName}"></td>

                <td th:text="${employee.email}"></td>

                <td th:text="${employee.gender}"></td>

                <td>

                    <a class="deleteA" @click="deleteEmployee"

                       th:href="@{'/employee/'+${employee.id}}">delete</a>

                    <a th:href="@{'/employee/'+${employee.id}}">update</a>

                </td>

            </tr>

        </table>

    </body>

</html>

具体功能：删除

①创建处理delete请求方式的表单

<!-- 作用：通过超链接控制表单的提交，将post请求转换为delete请求 -->

<form id="delete_form" method="post">

    <!-- HiddenHttpMethodFilter要求：必须传输_method请求参数，并且值为最终的请求方式 -->

    <input type="hidden" name="_method" value="delete"/>

</form>

引入vue.js

<script type="text/javascript" th:src="@{/static/js/vue.js}"></script>

删除超链接

<a class="deleteA" @click="deleteEmployee"th:href="@{'/employee/'+${employee.id}}">delete</a>

通过vue处理点击事件

<script type="text/javascript">

    var vue = new Vue({

        el:"#dataTable",

        methods:{

            //event表示当前事件

            deleteEmployee:function (event) {

                //通过id获取表单标签

                var delete_form = document.getElementById("delete_form");

                //将触发事件的超链接的href属性为表单的action属性赋值

                delete_form.action = event.target.href;

                //提交表单

                delete_form.submit();

                //阻止超链接的默认跳转行为

                event.preventDefault();

            }

        }

    });

</script>

③控制器方法

@RequestMapping(value = "/employee/{id}", method = RequestMethod.DELETE)

public String deleteEmployee(@PathVariable("id") Integer id){

    employeeDao.delete(id);

    return "redirect:/employee";

}

具体功能：跳转到添加数据页面

①配置view-controller

<mvc:view-controller path="/toAdd" view-name="employee_add"></mvc:view-controller>

②创建employee_add.html

<!DOCTYPE html>

<html lang="en" xmlns:th="http://www.thymeleaf.org">

    <head>

        <meta charset="UTF-8">

        <title>Add Employee</title>

    </head>

    <body>

        <form th:action="@{/employee}" method="post">

            lastName:<input type="text" name="lastName"><br>

            email:<input type="text" name="email"><br>

            gender:<input type="radio" name="gender" value="1">male

            <input type="radio" name="gender" value="0">female<br>

            <input type="submit" value="add"><br>

        </form>

    </body>

</html>

具体功能：执行保存

①控制器方法

@RequestMapping(value = "/employee", method = RequestMethod.POST)

public String addEmployee(Employee employee){

    employeeDao.save(employee);

    return "redirect:/employee";

}

具体功能：跳转到更新数据页面

①修改超链接

<a th:href="@{'/employee/'+${employee.id}}">update</a>

②控制器方法

@RequestMapping(value = "/employee/{id}", method = RequestMethod.GET)

public String getEmployeeById(@PathVariable("id") Integer id, Model model){

    Employee employee = employeeDao.get(id);

    model.addAttribute("employee", employee);

    return "employee_update";

}

③创建employee_update.html

<!DOCTYPE html>

<html lang="en" xmlns:th="http://www.thymeleaf.org">

    <head>

        <meta charset="UTF-8">

        <title>Update Employee</title>

    </head>

    <body>

        <form th:action="@{/employee}" method="post">

            <input type="hidden" name="_method" value="put">

            <input type="hidden" name="id" th:value="${employee.id}">

            lastName:<input type="text" name="lastName" th:value="${employee.lastName}">

            <br>

            email:<input type="text" name="email" th:value="${employee.email}"><br>

            <!--

                th:field="${employee.gender}"可用于单选框或复选框的回显

                若单选框的value和employee.gender的值一致，则添加checked="checked"属性

			-->

            gender:<input type="radio" name="gender" value="1"th:field="${employee.gender}">male

            <input type="radio" name="gender" value="0"th:field="${employee.gender}">female<br>

            <input type="submit" value="update"><br>

        </form>

    </body>

</html>

具体功能：执行更新

控制器方法

@RequestMapping(value = "/employee", method = RequestMethod.PUT)

public String updateEmployee(Employee employee){

    employeeDao.save(employee);

    return "redirect:/employee";

}

欢迎关注公众号：愚生浅末。

SpringMVC:RESTful案例的更多相关文章

  1. HTTP Status 405 - Request method 'GET' not supported？（尚硅谷Restful案例练习关于Delete方法出现的错误）

    哈罗大家好,最近在如火如荼的学习java开发----Spring系列框架,当学习到SpringMVC,动手实践RESTFUL案例时,发现了以上报错405,get请求方法没有被支持. 首先第一步,我查看 ...

  2. Java开发学习(二十三)----SpringMVC入门案例、工作流程解析及设置bean加载控制

    一.SpringMVC概述 SpringMVC是隶属于Spring框架的一部分,主要是用来进行Web开发,是对Servlet进行了封装.SpringMVC是处于Web层的框架,所以其主要的作用就是用来 ...

  3. SpringMVC入门案例及请求流程图（关于处理器或视图解析器或处理器映射器等的初步配置）

    SpringMVC简介:SpringMVC也叫Spring Web mvc,属于表现层的框架.Spring MVC是Spring框架的一部分,是在Spring3.0后发布的 Spring结构图 Spr ...

  4. springMVC入门（二）------springMVC入门案例

    简介 本案例主要完成了springMVC的基本配置,可针对响应的HTTP URL返回数据与视图 一.###web.xml的配置 要使springMVC生效,首先需要对web.xml进行配置,配置spr ...

  5. Restful 介绍及SpringMVC+restful 实例讲解

    restful不是一个框架,称为一种编码更烦更贴切吧,其核心类位于spring-web.jar中,即RestTemplate.class restful是rpc通过http协议的一种实现方式,和web ...

  6. springmvc restful配置有一个小小的坑坑

    首先web.xml配置 <!-- spring-mvc --> <servlet> <servlet-name>springServlet</servlet- ...

  7. SpringMVC Restful api接口实现

    [前言] 面向资源的 Restful 风格的 api 接口本着简洁,资源,便于扩展,便于理解等等各项优势,在如今的系统服务中越来越受欢迎. .net平台有WebAPi项目是专门用来实现Restful ...

  8. 让SpringMVC Restful API优雅地支持多版本

    好久没有更新博客,难得有空,记录一下今天写的一个小工具,供有需要的朋友参考. 在移动APP开发中,多版本接口同时存在的情况经常发生,通常接口支持多版本,有以下两种方式: 1.通过不同路径区分不同版本 ...

  9. 关于CKEditor4.5.6的使用，自定义toolbar配置，上传图片案例（SpringMVC+MyBatis案例），自定义行高，去编辑器的中内容，将编辑器中内容设置到指定的位置等

     关于CKEditor的一个配置整理,改文件为config.js: 文件内容如下: /** * @license Copyright (c) 2003-2016, CKSource - Frede ...

  10. SpringMVC RESTful风格URL处理带点的参数

    使用了RESTful风格的URL.但是在处理带点的搜索参数,比如baidu.com的时候,后台就取不到正确的参数了. 搜索了下原因,原来是SpringMVC将点号看作扩展分隔符号了,因此后台没法拿到正 ...

随机推荐

  1. 【Zookeeper】结构、应用、安装部署与参数、客户端命令行操作、API应用、内部原理（选举机制、写数据、监听器）

    一.Zookeeper入门 1.概述 分布式服务管理框架(存储和管理数据) Zookeeper=文件系统+通知机制 2.特点 主从集群 半数以上,正常工作 请求顺序执行 数据更新具有原子性 3.数据结 ...

  2. 【十次方微服务后台开发】Day02：加密与JWT鉴权、微服务注册中心、配置中心、熔断器、网关、消息总线、部署与持续集成、容器管理与监控Rancher、influxDB、grafana

    一.密码加密与微服务鉴权JWT 1.BCrypt密码加密 Spring Security 提供了BCryptPasswordEncoder类,实现Spring的PasswordEncoder接口使用B ...

  3. git、docker、lunix、python、pycharm等常用命令整理

    git的使用 上传代码git clone ....git branch new_branchgit checkout branch_namegit add .git commit -m "& ...

  4. .net6制作让同事不能上网的arp欺骗工具

    摘一段来自网上的arp欺诈解释:ARP欺骗(ARP spoofing),又称ARP毒化(ARP poisoning,网络上多译为ARP病毒)或ARP攻击,是针对以太网地址解析协议(ARP)的一种攻击技 ...

  5. 在微信上搭建ChatGpt机器人

    在微信上搭建ChatGpt机器人 项目地址:https://gitee.com/shtml/wechatbot?_from=gitee_search 准备 一个服务器:Windos,Centos,Ub ...

  6. Spring学习笔记 - 第二章 - 注解开发、配置管理第三方Bean、注解管理第三方Bean、Spring 整合 MyBatis 和 Junit 案例

    Spring 学习笔记全系列传送门: Spring学习笔记 - 第一章 - IoC(控制反转).IoC容器.Bean的实例化与生命周期.DI(依赖注入) [本章]Spring学习笔记 - 第二章 - ...

  7. vscode问题：由于找不到ffmpag.dll文件，无法继续执行代码

    工作中发现VS code打不开了,显示如下:  解决方法: 一.打开Microsoft VS Code 文件夹,发现一部分文件被打包进了一个叫"_"的文件夹(第一个)  二.把该文 ...

  8. Potree 002 Desktop开发环境搭建

    1.工程创建 我们使用Visual Studio 2022开发,把下载好后的PotreeDesktop源码添加到Visual Studio中. 打开Visual Studio 2022,新建Asp.N ...

  9. Python开发的常用组件

    1. 生成6位数字随机验证码 import random import string def num_code(length=6): """ 生成长度为length的数字 ...

  10. ua5.4源码剖析：三. C++与Lua相互调用

    概述 从本质上来看,其实说是不存在所谓的C++与lua的相互调用.lua是运行在C上的,简单来说lua的代码会被编译成字节码在被C语言的语法运行.在C++调用lua时,其实是解释运行lua文件编译出来 ...