目录
3 运行效果
1 通过 Ajax 完成删除用户
<script>
$(function () {
//获取页面初始化数据
getData();
//添加按钮绑定点击事件
$("#add").click(function(){
addOrUpdateUser("addUser");
});
//更新按钮绑定点击事件
$("#update").click(function(){
addOrUpdateUser("updateUser");
});
});
//获取页面初始化数据
function getData(){
$.getJSON("user.do",{flag:"getData"},function (result) {
init(result);
});
}
//遍历数据生成数据
function init(obj){
var str ="";
$.each(obj,function(){
str+= "<tr align='center'><td id='"+this.userid+"'>"+this.userid +"</td><td>"+this.username+"</td><td>"+this.usersex+"</td><td>"+this.userbirth+"</td><td><a href='#' onclick='preUpdateUser("+this.userid+")'>选择更新</a> <a href='#' onclick='deleteUser("+this.userid+")'>删除</a></td></tr>"
});
$("#tBody").prepend(str);
}
//用户添加或者用户更新
function addOrUpdateUser(flag){
//从页面中获取数据
var userid = $("#userid").val();
var username = $("#username").val();
var usersex = $("#usersex").val();
var userbirth = $("#userbirth").val();
var data = {
userid:userid,
username:username,
usersex:usersex,
userbirth:userbirth,
flag:flag
}
$.get("user.do",data,function(result){
alert(result);
});
location.reload();
}
//更新之前的数据选择
function preUpdateUser(userid){
var arr = new Array();
$("#"+userid).closest("tr").children().each(function(index,ele){
if(index <=3){
arr[index]= ele.innerText
}
});
$("#userid").val(arr[0]);
$("#username").val(arr[1]);
$("#usersex").val(arr[2]);
$("#userbirth").val(arr[3]);
$("#userid").attr("readonly",true);
}
//删除用户
function deleteUser(userid){
$("#"+userid).closest("tr").remove();
$.get("user.do",{userid:userid},function(result){
alert(result);
})
}
</script>
2 在 Servlet 处理删除用户请求
/**
* 用户管理Servlet
*/
@WebServlet("/user.do")
public class UserServlet extends HttpServlet {
//生成模拟数据初始化
@Override
public void init() throws ServletException {
User user = new User();
user.setUserid(1);
user.setUsername("Oldlu");
user.setUsersex("male");
user.setUserbirth(new Date());
User user2 = new User();
user2.setUserid(2);
user2.setUsername("Kevin");
user2.setUsersex("male");
user2.setUserbirth(new Date());
List<User> list = new ArrayList<>();
list.add(user);
list.add(user2);
ServletContext servletContext = this.getServletContext();
servletContext.setAttribute("list",list);
}
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
this.doPost(req, resp);
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String flag = req.getParameter("flag");
if("getData".equals(flag)){
this.getData(req,resp);
}else if("addUser".equals(flag)){
this.addUser(req,resp);
}else if("updateUser".equals(flag)){
this.updateUser(req,resp);
}else{
this.deleteUser(req,resp);
}
}
//获取页面初始化数据
private void getData(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
List<User> list = (List<User>) this.getServletContext().getAttribute("list");
String s = JsonUtils.objectToJson(list);
resp.setContentType("application/json");
PrintWriter pw = resp.getWriter();
pw.print(s);
pw.flush();
pw.close();
}
//处理添加用户请求
private void addUser(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
User user = this.createUser(req);
ServletContext servletContext = this.getServletContext();
List<User> list = (List<User>) servletContext.getAttribute("list");
list.add(user);
resp.setContentType("text/plain;charset=utf-8");
PrintWriter pw = resp.getWriter();
pw.print("添加成功");
pw.flush();
pw.close();
}
//获取请求数据
private User createUser(HttpServletRequest req){
String userid = req.getParameter("userid");
String username = req.getParameter("username");
String usersex = req.getParameter("usersex");
String userbirth = req.getParameter("userbirth");
User user = new User();
user.setUserid(Integer.parseInt(userid));
user.setUsername(username);
user.setUsersex(usersex);
SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
try {
Date parse = sdf.parse(userbirth);
user.setUserbirth(parse);
} catch (ParseException e) {
e.printStackTrace();
}
return user;
}
//处理更新用户请求
private void updateUser(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException{
User user = this.createUser(req);
ServletContext servletContext = this.getServletContext();
List<User> list = (List<User>) servletContext.getAttribute("list");
User u = null;
for(User temp : list){
if(temp.getUserid() == user.getUserid()){
u = temp;
break;
}
}
if(u != null){
list.remove(u);
}
list.add(user);
resp.setContentType("text/plain;charset=utf-8");
PrintWriter pw = resp.getWriter();
pw.print("更新成功");
pw.flush();
pw.close();
}
//处理删除用户请求
private void deleteUser(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException{
ServletContext servletContext = this.getServletContext();
List<User> list = (List<User>) servletContext.getAttribute("list");
String userid = req.getParameter("userid");
User user = null;
for(User temp:list){
if((temp.getUserid()+"").equals(userid)){
user = temp;
break;
}
}
if(user != null){
list.remove(user);
}
resp.setContentType("text/plain;charset=utf-8");
PrintWriter pw = resp.getWriter();
pw.print("删除成功");
pw.flush();
pw.close();
}
}
3 运行效果
