Springboot的 get查看,post創建,put更新,delete刪除 -四種請求實例(form + controller)


總結

     --get查看數據,
        post創建新數據行,
        put更新數據,
        delete刪除數據行--

add和select功能都共用這一個頁面, 需要進行區分顯示 ,使用thymeleaf的三元選擇,判斷emp是否為空的警告, 即可;
	舉例:
	發送put請求,再進行修改員工的數據,在頁面的methd只支持post和get,需要三步:
		1.在SpringMVC中配置HiddenHttpMethodFilter;(SpringBoot就自動配置好了,進入WebMvcAutoConfigure進行查看)
		2.在頁面進行創建一個post表單
		3.創建一個input項, name="_method";值就是我們指定的請求方式"delete"/"put" ;

html頁面的form表單舉例 delete請求

<td>
 <form method="post" th:action="@{/emp/}+${emp.id}">
                                            <input name="_method" value="delete" type="hidden" />
                                            <button class="btn btn-sm btn-danger" type="submit">刪除</button>
                                        </form>
</td>

控制器 舉例 delete請求

 /**
     * 6: 員工刪除
     * @param id
     * @return
     */
    @DeleteMapping("/emp/{id}")
    public String deleteEmployee(@PathVariable Integer id){
        employeeDao.delete(id);
        return "redirect:/emps";
    }

html頁面的form表單舉例 delete請求 的優化

如上圖,會存在大量重復的form表單代碼,畢竟在遍歷生成標簽的時候,每個會隨之生成一個form表單
頁面顯示后代碼冗余過大,JS腳本優化如下

<td>
    <button th:attr="del_uri=@{/emp/}+${emp.id}" class="btn btn-sm btn-danger deleteBtn" >刪除</button>
</td>
-------------如下放到公共區------------
<form id="deleteEmpForm" method="post">
                    <input type="hidden" name="_method" value="delete" />
                </form>
--------------- 如下jquery代碼----------
 <script>
            $(".deleteBtn").click(function () {
                //刪除當前員工的功能
                $("#deleteEmpForm").attr("action",$(this).attr("del_uri")).submit();
                return false;
            });
  </script>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM