编辑员工信息
程序的执行流程:
(1)点击编辑按钮时,页面跳转到add.html,并在url中携带参数[员工id]
(2)在add.html页面获取url中的参数[员工id]
(3)发送ajax请求,请求服务端,同时提交员工id参数
(4)服务端接收请求,根据员工id查询员工信息,将员工信息以json形式响应给页面
(5)页面接收服务端响应的json数据,通过VUE的数据绑定进行员工信息回显
(6)点击保存按钮,发送ajax请求,将页面中的员工信息以json方式提交给服务端
(7)服务端接收员工信息,并进行处理,完成后给页面响应
(8)页面接收到服务端响应信息后进行响应处理
注:add.html页面为公共页面,新增员工和编辑员工都在此页面进行操作
点击编辑按钮后发送请求并提交id到Controller服务端查询对应id的员工信息,进入编辑页面回显此条返回的员工信息
/** * 根据id查询员工信息 * @param id * @return */ @GetMapping("/{id}") public R<Employee> getById(@PathVariable Long id){ log.info("根据id查询员工"); Employee employee = employeeService.getById(id); return R.success(employee); }
编辑成功后发送请求更新数据库。复用请求上一节启用/禁用时写的Controller服务端处理更新操作。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构