四、查询-ajax

四、查询-ajax

1、index.jsp页面直接发送ajax请求进行员工分页数据的查询

2、服务器将查出的数据,以json字符串的形式返回给浏览器

3、浏览器收到js字符串。可以使用js对json进行解析,使用js通过dom增删改改变页面。

4、返回json。实现客户端的无关性。

五、新增

在这里插入图片描述
新增逻辑:

  1. 在index.jsp页面点击”新增”
  2. 弹出新增对话框
  3. 去数据库查询部门列表,显示在对话框中
  4. 用户输入数据,并进行校验:jquery前端校验,ajax用户名重复校验,重要数据(后端校验(JSR303),唯一约束);
  5. 完成保存
  6. 关闭模态框
  7. 跳转到最后一页

URI:

  • /emp/{id}GET 查询员工
  • /emp POST 保存员工
  • /emp/{empId} PUT 修改员工
  • /emp/{ids} DELETE 删除员工

六、修改

在这里插入图片描述
修改逻辑:

  1. 点击编辑
  2. 弹出用户修改的模态框(显示用户信息)
  3. 点击更新,完成用户修改
  4. 关闭模态框
  5. 跳转到当前页面

七、删除

在这里插入图片描述
单个/批量删除逻辑:

  1. 点击对应的删除
  2. 提示确认是否删除
  3. 确认后进行删除
  4. 跳转回当前页面

猜你喜欢

转载自blog.csdn.net/Lu1048728731/article/details/115209848