这是上一篇博客：https://blog.csdn.net/qq_41115379/article/details/114376776
这是下一篇博客：https://blog.csdn.net/qq_41115379/article/details/114548834
首先需要script，去这个网站https://www.bootcdn.cn/jquery/
直接把这个赋值到departments.ftl中
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
再修改departments.ftl
<!DOCTYPE html>
<html>
<head>
<title>CoolMeeting会议管理系统</title>
<link rel="stylesheet" href="/styles/common.css"/>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
</head>
<body>
<#include 'top.ftl'>
<div class="page-body">
<#include 'leftMenu.ftl'>
<div class="page-content">
<div class="content-nav">
人员管理 > 部门管理
</div>
<form action="/admin/adddepartment">
<fieldset>
<legend>添加部门</legend>
部门名称:
<input type="text" name="departmentname" id="departmentname" maxlength="20"/>
<input type="submit" class="clickbutton" value="添加"/>
</fieldset>
</form>
<table class="listtable">
<caption>所有部门:</caption>
<tr class="listheader">
<th>部门编号</th>
<th>部门名称</th>
<th>操作</th>
</tr>
<#if deps??>
<#list deps as dep>
<tr>
<td>${dep.departmentid}</td>
<td id="depname${dep.departmentid}">${dep.departmentname}</td>
<td>
<a class="clickbutton" href="#" id="edit${dep.departmentid}" onclick="editDep(${dep.departmentid})">编辑</a>
<a class="clickbutton" style="display: none" href="#" id="cancel${dep.departmentid}" onclick="cancelDep(${dep.departmentid})">取消</a>
<a class="clickbutton" href="/admin/deletedep?departmentid=${dep.departmentid}">删除</a>
</td>
</tr>
</#list>
</#if>
</table>
</div>
</div>
<div class="page-footer">
<hr/>
更多问题，欢迎联系<a href="mailto:webmaster@eeg.com">管理员</a>
<img src="/images/footer.png" alt="CoolMeeting"/>
</div>
<script>
var depname;
function cancelDep(depid){
var editBtn=$('#edit'+depid);
var cancelBtn=$('#cancel'+depid);
var ele=$('#depname'+depid);
cancelBtn.css('display','none');
editBtn.html('编辑');
ele.html(depname);
}
function editDep(depid){
var editBtn=$('#edit'+depid);
var cancelBtn=$('#cancel'+depid);
var ele=$('#depname'+depid);
depname=ele.html();
if(cancelBtn.css('display')=='none'){
cancelBtn.css('display','inline');
editBtn.html('确定');
var depName=ele.text();
ele.html('<input type="text" value="'+depName+'"/>')
}else{
var children= ele.children('input');
var val=children.val();
$.post('/admin/updatedep',{id:depid,name:val},function (msg){
if(msg=='success'){
cancelBtn.css('display','none');
editBtn.html('编辑');
ele.html(val);
}
})
}
}
</script>
</body>
</html>
再开始写后端
departmentController
@RequestMapping("/updatedep")
//因为要返回字符串
@ResponseBody
public String updatedep(Integer id,String name){
Integer result=departmentService.updatedep(id,name);
if(result==1){
//也就是成功了
return "success";
}
return "error";
}
departmentService
public Integer updatedep(Integer id, String name) {
return departmentMapper.updatedep(id,name);
}
departmentMapper
Integer updatedep(@Param("id") Integer id, @Param("name") String name);
departmentMapper.xml
<update id="updatedep">
update department set departmentname=#{name} where departmentid=#{id};
</update>
再运行一下：
这样就编辑成功了
其中小知识点 GetMapping不能和requestBody一起用，原因是在于requestBody是接受前端传来的个Json对象，可是之前很好奇的是，我单单用GetMapping来实现添加功能的时候，也是可以的
requestBody和之前的添加到底有什么区别
首先解决第一个困惑，为什么我添加这边，能用GetMapping,而不是PostMapping
主要是在于，form表单默认是GET方法，所以要用GetMapping
当你把表单的method改成post的时候：
<form method="post" action="/admin/adddepartment">
也就可以用PostMapping方法了
而为什么要用PostMapping 和requestBody是因为
$.post(’/admin/updatedep’,{id:depid,name:val},function (msg){
这个代码，用了post请求，而且传参数了，因为是post的，所以是在url外面的，但是post的参数是放在requestBody中的，所以可以说是，需要requestBody的存在，而为什么GET不能和requestBody放在一起，其实可以完全理解为 ，requestBody本身就是为post服务的
员工搜索
forward:/searchemployees redirect :/searchemployees searchemployees /admin/searchemployees 之间的区别 ：
比较强行的可以理解为：直接return 是一个静态的，而redirect和forward则是一种动态的
我们都知道，在一般情况下，控制器方法返回的字符串都会被当做逻辑视图名来处理。
但是当字符串带有“forward”或者“redirect”前缀时，则对他们进行特殊处理。把“forward”与“redirect”当成指示符，其后的字符串
作为URL来处理。
创建一个EmployeeController
package org.javaboy.meeting.controller;
import org.apache.ibatis.annotations.Param;
import org.javaboy.meeting.model.Employee;
import org.javaboy.meeting.service.EmployeeService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.servlet.ModelAndView;
import java.util.List;
@Controller
@RequestMapping("/admin")
public class EmployeeController {
public static final Integer PAGE_SIZE=10;
@Autowired
EmployeeService employeeService;
@RequestMapping("/searchemployees")
//这个参数的意思是 默认是第一页
public String getAllEmployees(Employee employee, @RequestParam(defaultValue = "1")Integer page, Model model){
//这个方法是用来搜索全部的employee 需要有这些参数
List<Employee> emps= employeeService.getAllEmployees(employee,page,PAGE_SIZE);
//这里用来获取总页数,参数也是employee 这个count就行了
Long total=employeeService.getTotal(employee);
//然后看到页面有关于各种各样的页数的消息，全都放到model里面传到前端就行了
model.addAttribute("emps",emps);
model.addAttribute("total",total);
//还有第几页
model.addAttribute("page",page);
//关于第几页的话，可以默认页数为10 当前可以分成的多少页
//如果取余完全的话，就直接取，如果不行的话，就还需要+1
model.addAttribute("pageNum",(total%PAGE_SIZE==0?total/PAGE_SIZE:total/PAGE_SIZE+1));
//然后这边是return一个 还是原来的位置吧
//这里不确定要不要回去 这里要不要斜杠呢
return "/searchemployees";
}
@RequestMapping("/updateemp")
public String updateemp(Integer id){
//这里就直接修改就行了
//问题在这 empid是null 的
System.out.println(id);
System.out.println(employeeService.updatestatus(id,0));
return "redirect:/admin/searchemployees?status=1";
}
}
searchemployees.ftl
<!DOCTYPE html>
<html>
<head>
<title>CoolMeeting会议管理系统</title>
<link rel="stylesheet" href="/styles/common.css"/>
<style type="text/css">
</style>
</head>
<body>
<#include 'top.ftl'>
<div class="page-body">
<#include 'leftMenu.ftl'>
<div class="page-content">
<div class="content-nav">
会议预定 > 搜索员工
</div>
<form action="/admin/searchemployees" method="get">
<fieldset>
<legend>搜索会议</legend>
<table class="formtable">
<tr>
<td>姓名：</td>
<td>
<input name="employeename" type="text" id="employeename" maxlength="20"/>
</td>
<td>账号名：</td>
<td>
<input name="username" type="text" id="accountname" maxlength="20"/>
</td>
<td>状态：</td>
<td>
<input type="radio" id="status" name="status" value="1" checked="checked"/><label>已批准</label>
<input type="radio" id="status" name="status" value="0"/><label>待审批</label>
<input type="radio" id="status" name="status" value="2"/><label>已关闭</label>
</td>
</tr>
<tr>
<td colspan="6" class="command">
<input type="submit" class="clickbutton" value="查询"/>
<input type="reset" class="clickbutton" value="重置"/>
</td>
</tr>
</table>
</fieldset>
</form>
<div>
<h3 style="text-align:center;color:black">查询结果</h3>
<div class="pager-header">
<div class="header-info">
共<span class="info-number">${total}</span>条结果，
分成<span class="info-number">${pageNum}</span>页显示，
当前第<span class="info-number">${page}</span>页
</div>
<div class="header-nav">
<input type="button" class="clickbutton" value="首页"/>
<input type="button" class="clickbutton" value="上页"/>
<input type="button" class="clickbutton" value="下页"/>
<input type="button" class="clickbutton" value="末页"/>
<form action="/admin/searchemployees" style="display: inline" method="get">
跳到第<input type="text" id="pagenum" class="nav-number"/>页
<input type="submit" class="clickbutton" value="跳转"/>
</form>
</div>
</div>
</div>
<table class="listtable">
<tr class="listheader">
<th>姓名</th>
<th>账号名</th>
<th>联系电话</th>
<th>电子邮件</th>
<th>操作</th>
</tr>
<#if emps??>
<#list emps as emp>
<tr>
<td>${emp.employeename}</td>
<td>${emp.username}</td>
<td>${emp.phone}</td>
<td>${emp.email}</td>
<td>
<a name="closeName" class="clickbutton" href="/admin/updateemp?id=${emp.employeeid}">关闭账号</a>
</td>
</tr>
</#list>
</#if>
</table>
</div>
</div>
<div class="page-footer">
<hr/>
更多问题，欢迎联系<a href="mailto:webmaster@eeg.com">管理员</a>
<img src="/images/footer.png" alt="CoolMeeting"/>
</div>
</body>
</html>
EmployeeService
public List<Employee> getAllEmployees(Employee employee, Integer page, Integer pageSize) {
//
page=(page-1)*pageSize;
return employeeMapper.getAllEmployees(employee,page,pageSize);
}
public Long getTotal(Employee employee) {
return employeeMapper.getTotal(employee);
}
EmployMapper
List<Employee> getAllEmployees(@Param("emps") Employee employee, @Param("page") Integer page,@Param("pagesize") Integer pageSize);
Long getTotal(Employee employee);
EmployMapper.xml
<select id="getAllEmployees" resultType="org.javaboy.meeting.model.Employee">
select * from employee where status=#{emps.status}
<if test="emps.employeename!=null">
and employeename like concat ('%',#{emps.employeename},'%')
</if>
<if test="emps.username!=null">
and username like concat ('%',#{emps.username},'%')
</if>
limit #{page},#{pagesize};
</select>
<select id="getTotal" resultType="java.lang.Long">
select count(*) from employee where status=#{status}
<if test="employeename!=null">
and employeename=#{employeename}
</if>
<if test="username!=null">
and username=#{username}
</if>
</select>
这里要注意：
<a name="closeName" class="clickbutton" href="/admin/updateemp?id=${emp.employeeid}">关闭账号</a>
这里的id要和
@RequestMapping("/updateemp")
public String updateemp(Integer id){
//这里就直接修改就行了
//问题在这 id是null 的
System.out.println(id);
System.out.println(employeeService.updatestatus(id,0));
return "redirect:/admin/searchemployees?status=1";
}
这里的id一样，不然会出现问题
再运行一下
扫一扫
549
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
