springboot之restfulcrud--修改

list.html
<a  href="#" th:href="@{/emp/}+${emp.id}" class="btn btn-sm btn-primary">编辑</a>

EmployeeController

//来到修改界面，查出当前员工在页面回显
@GetMapping("/emp/{id}")
public String toEditPage(@PathVariable("id") Integer id, Model model){
    Employee employee = employeeDao.getEmpById(id);
    model.addAttribute("emp",employee);
    //页面要显示所有的部门列表
    Collection<Department> departments = departmentDao.getDepartments();
    model.addAttribute("depts",departments);
    return "emp/add";//add是个修改添加二合一的页面
}

add.html

th:value,th:checked,th:selected

<input type="text" class="form-control" id="LastName" name="lastName" placeholder="LastName" th:value="${emp.lastName}">

<input type="email" class="form-control" id="Email"  name="email" placeholder="zhangsan@163.com" th:value="${emp.email}">

<input class="form-check-input" type="radio" name="gender" value="1" th:checked="${emp.gender==1}">

<input class="form-check-input" type="radio" name="gender" value="0" th:checked="${emp!=null}?${emp.gender==0}">

<select class="form-control"  name="department.id" >
    <option th:selected="${dept.id == emp.department.id}" th:each="dept:${depts}" th:value="${dept.id}" th:text="${dept.departmentName}"></option>
</select>

<input type="text" class="form-control" id="birthDate" placeholder="2012-12-12" name="birth" th:value="

${#dates.format(emp.birth,'yyyy-MM-dd HH:mm:ss')}">

form表单需要区分是员工修改还是添加

修改

<input type="text" class="form-control" id="LastName" name="lastName" placeholder="LastName" th:value="${emp!=null}?${emp.lastName}">

<input type="email" class="form-control" id="Email"  name="email" placeholder="zhangsan@163.com" th:value="${emp!=null}?${emp.email}">

<input class="form-check-input" type="radio" name="gender" value="1" th:checked="${emp!=null}?${emp.gender}==1">

<input class="form-check-input" type="radio" name="gender" value="0" th:checked="${emp!=null}?${emp.gender}==0">

<option th:selected="${emp!=null}?${dept.id == emp.department.id}" th:each="dept:${depts}" th:value="${dept.id}" th:text="${dept.departmentName}"></option>

<input type="text" class="form-control" id="birthDate" placeholder="2012-12-12" name="birth" th:value="${emp!=null}?${#dates.format(emp.birth,'yyyy-MM-dd HH:mm:ss')}">

<button type="submit" class="btn btn-primary" th:text="${emp!=null}?'修改':'添加'">添 加</button>

<!--发送put请求-->
<!--1.SpringMVC配置HiddenHttpMethodFilter（springboot自动配置好的WebMvcAutoConfiguration）
    2.页面创建一个post表单
    3.创建一个 input项,name="_method",值就是我们请求的方式-->

add.html

<input type="hidden" name="_method" value="put" th:if="${emp!=null}">//因为是二合一页面，所以需要if判断

<input type="hidden" name="id" th:value="${emp.id}" th:if="${emp!=null}">

EmployeeController

//员工修改,需要提交员工id
@PutMapping("/emp")
public String updateEmployee(Employee employee){
    employeeDao.save(employee);
    return "redirect:/emps";
}

====================================================================================================

删除

list.html

<form th:action="@{/emp/}+${emp.id}" method="post">

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

    <button type="submit" class="btn btn-sm btn-danger">删除</button>

</form>

 EmployeeController

//员工删除
@DeleteMapping("/emp/{id}")
public String deleteEmployee(@PathVariable("id") Integer id){
    employeeDao.deleteEmpById(id);
    return "redirect:/emps";
}

修改list.html,th:attr自定义属性

<button th:attr="del_uri=@{/emp/}+${emp.id}"  class="btn btn-sm btn-danger deleteBtn">删除</button>

<form id="deleteEmpForm" method="post">
    <input type="hidden" name="_method" value="delete">
</form>

<script>
    $(".deleteBtn").click(function () {
        $("#deleteEmpForm").attr("action",$(this).attr("del_uri")).submit();
    })
</script>

注意在这之前的js地址要写对

<script src="./Dashboard_files/jquery-3.3.1.slim.min.js" th:src="@{/webjars/jquery/3.4.1/jquery.js}"></script>
<script src="./Dashboard_files/popper.min.js" th:src="@{/webjars/popper.js/1.14.3/popper.js}"></script>
<script src="./Dashboard_files/bootstrap.min.js" th:src="@{/webjars/bootstrap/4.3.1/js/bootstrap.js}"></script>

<!-- Icons -->
<script src="./Dashboard_files/feather.min.js" th:src="@{/asserts/js/feather.min.js}"></script>