SpringMVC:RESTful案例-6ren

SpringMVC:RESTful案例

转载作者：我是一只小鸟更新时间：2023-02-25 22:31:09

28

4

相关准备
功能清单
具体功能：访问首页
- ①配置view-controller
- ②创建页面
具体功能：查询所有员工数据
- ①控制器方法
- ②创建employee_list.html
具体功能：删除
- ①创建处理delete请求方式的表单
- ③控制器方法
具体功能：跳转到添加数据页面
- ①配置view-controller
- ②创建employee_add.html
具体功能：执行保存
- ①控制器方法
具体功能：跳转到更新数据页面
- ①修改超链接
- ②控制器方法
- ③创建employee_update.html
具体功能：执行更新
- 控制器方法

功能清单

功能	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案例的文章就讲到这里了,如果你想了解更多关于SpringMVC:RESTful案例的内容请搜索CFSDN的文章或继续浏览相关文章，希望大家以后支持我的博客！。

28

4

0

文章推荐：两台服务器实现免密登录

文章推荐：这些JavaScript笔试题你能答对几道？

文章推荐：推荐一个Dapper扩展CRUD基本操作的开源库

文章推荐： GPT接入飞书

Oracle 案例
这个问题在这里已经有了答案: Oracle: merging two different queries into one, LIKE & IN (1 个回答) 8年前关闭。我有以下代码: case
MYSQL存储过程、案例
我查阅过此页面:http://dev.mysql.com/doc/refman/5.1/en/case.html以及这个，但无法获得一个简单的程序来工作...... 更新:为了明确我想要做什么:我想从
MySQL查询优化总..案例
有什么办法可以优化下面的查询吗？ SELECT DATE_FORMAT(a.duedate,'%d-%b-%y') AS dte, duedate, SUM(CASE WHEN (typeofnoti
MYSQL 案例
我进退两难，以下 SQL 查询的结果是什么以及它是如何工作的: SELECT ... CASE WHEN (a.FIELD=1 AND b.FIELD=2) THEN 1 WHEN
Java基础之打印万年历的简单实现(案例)
问题：输入年，月，打印对应年月的日历。示例：问题分析： 1，首先1970年是Unix系统诞生的时间，1970年成为Unix的元年，1970年1月1号是星期四，现在大多的手机的日历功能只能显
理论+案例，带你掌握Angular依赖注入模式的应用
**摘要：**介绍了Angular中依赖注入是如何查找依赖，如何配置提供商，如何用限定和过滤作用的装饰器拿到想要的实例，进一步通过N个案例分析如何结合依赖注入的知识点来解决开发编程中会遇到的问题。本
scala - (案例)类构造函数上下文中的隐式转换
我想拥有自动伴侣类apply case 类的构造函数来为我执行隐式转换，但无法弄清楚如何这样做。我到处搜索，我能找到的最接近的答案是 this问题(我将解释为什么它不是我在下面寻找的)。我有一个看起
具有多列的 SQL 案例
您好，我已经浏览了“多列案例”问题，但没有看到与此相同的内容，所以我想我应该问一下。基本上我有两个我想要连接的表(都是子查询的结果)。它们具有相同的列名称。如果我加入他们的 ID 和 SELECT
非直觉类型推断的 Kotlin 案例
我发现了一些类型推断的非直觉行为。因此，语义等效代码的工作方式不同，具体取决于编译器推断出的有关函数返回类型的信息。当您在最小单元测试中重现此案例时，或多或少会清楚发生了什么。但我担心在编写框架代码时
SQL Server - 案例
CREATE TABLE test ( sts_id int , [status1] int , [status2] int , [status3] int , [status4] int ) INS
带有内连接的 MYSQL 案例
我有以下声明: SELECT Dag AS Dag, CASE Jaar WHEN 2013 THEN Levering END AS '2013', CASE
mysql - 案例、子查询和连接
我想做的是为所有高于平均时间、平均时间和低于平均时间的游乐设施获取平均tip_portion。所以返回3行。当我运行它时，它显示: ERROR: missing FROM-clause entry
Mysql 案例 - 统计特定时间内的字段数
我正在尝试设置一个包含以下字段的报告: 非常需要报告来显示日期、该日期内的总记录(因此我按日期分组)，然后按小时计算 12 小时工作日(从上午 8 点到晚上 8 点)我需要计算记录在这些时间内出现的时
mysql - 在一个查询中获取所有 WHERE 案例
我有这个查询 SELECT users.name FROM users LEFT JOIN weapon_stats ON users.id = weapon_stats.zp_id WHERE we
计数不同时的 MySQL 案例
我正在尝试按收视率等级获取不同视频的计数。我有下表: vid_id views 1 6 1 10 1 900 2 850 2 125000
mysql - 案例 When 案例之间的联合
假设我有一个如下所示的 SQL 语句: select supplier, case when platform in (5,6) then 'mobile' when p
MySql - 更新/案例
我有一个表测试 TestNumber (int primary key) InactiveBitwise (int) 我执行以下命令: UPDATE tests SET CASE WH
带分组依据的 MySQL 案例
我有一个像这样的表(name=expense): id amount date 1 -1687 2014-01-02 00:00:00.0 2 11000 2014-01-02 0
C++ 案例 multimap
我有一个 multimap 定义 typedef std::pair au_pair; //vertices typedef std::pair acq_pair; //ch qlty specifi
c++ - 将静态常量类实例用于开关/案例
我有一个有点像枚举的类，它的每个实例都有一个唯一的 int 值，该值从 0 开始并在每个新实例时递增。 class MyEnumLikeClass { static int NextId =

首页

博学

6Ren·AI

商城

SpringMVC:RESTful案例

相关准备

功能清单

具体功能：访问首页

①配置view-controller

②创建页面

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

①控制器方法

②创建employee_list.html

具体功能：删除

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

③控制器方法

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

①配置view-controller

②创建employee_add.html

具体功能：执行保存

①控制器方法

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

①修改超链接

②控制器方法

③创建employee_update.html

具体功能：执行更新

控制器方法