1.ajax异步请求数据后填入模态框
请求数据的按钮(HTML)
ajax异步请求数据后给id为queryInfo的模态框赋值并弹出模态框(JS)
//查询单个
functionquery(id) {
$.ajax({
url :"/small/productServlet",
async :true,
type :"POST",
data : {"type" : "query","id": id
},//成功后开启模态框
success : showQuery,
error :function() {
alert("请求失败");
},
dataType :"json"});
}//查询成功后向模态框插入数据并开启模态框。data是返回的JSON对象
functionshowQuery(data) {
$("#name1").val(data.name);
$("#xinghao1").val(data.xinghao);
$("#address1").val(data.address);
$("#department1").val(data.department);
$("#unit1").val(data.unit);
$("#number1").val(data.number);
$("#price1").val(data.price);
$("#totalprice1").val(data.totalprice);
$("#come1").val(e);
$("#buytime1").val(data.buytime);
$("#useperson1").val(data.useperson);
$("#handleperson1").val(data.handleperson);
$("#admini1").val(data.admini);//显示模态框
$(‘#queryInfo‘).modal(‘show‘);
}
后台处理ajax请求并返回JSON串(Java)
protected voiddoGet(HttpServletRequest request, HttpServletResponse response)throwsServletException, IOException {
RegisterService service= newRegisterServiceImpl();
request.setCharacterEncoding("UTF-8");
response.setCharacterEncoding("UTF-8");
response.setContentType("text/html; charset=UTF-8");
String type= request.getParameter("type");if (type != null && "add".equals(type)) {try{this.add(request, response, service);
}catch(Exception e) {//TODO Auto-generated catch block
e.printStackTrace();
}
}if (type != null && "query".equals(type)) {try{this.query(request, response, service);
}catch(Exception e) {//TODO Auto-generated catch block
e.printStackTrace();
}
}
}protected voiddoPost(HttpServletRequest request, HttpServletResponse response)throwsServletException, IOException {
doGet(request, response);
}public voidquery(HttpServletRequest request, HttpServletResponse response, RegisterService service)throwsException {
Integer id= Integer.parseInt(request.getParameter("id"));
Register register=service.getRegisterById(id);
Gson gson= newGson();
String json=gson.toJson(register);
System.out.println(json);
response.getWriter().write(json);
}
JSON串:
{"id":16,"name":"测试名称16","address":"测试地址2","department":"测试部门2","unit":"测试单位2","number":1,"price":1.5,"totalprice":1.5,"come":"来源2","buytime":"八月 23, ","useperson":"使用人2","handleperson":"经办人2","admini":"管理员部门2"}
2.ajax异步请求删除数据后刷新页面
请求删除的按钮(HTML)
Ajax请求删除数据后刷新页面(JS)
//ajax异步删除后刷新页面
functiondeleteInfo(id) {
alert("dele");
$.ajax({
url :"/small/productServlet",
async :true,
type :"POST",
data : {"type" : "delete","id": id
},
success :function(data) {
alert(data);//删除成功后刷新页面
window.location.reload();
},
error :function() {
alert("请求失败");
},
dataType :"text"});
}
后台处理删除的ajax请求(Java)
//根据id删除
public voiddelete(HttpServletRequest request, HttpServletResponse response, RegisterService service)throwsException {
Integer id= Integer.valueOf(request.getParameter("id"));boolean result =service.deleteRegisterById(id);if(result) {
response.getWriter().write("success delete!");
}
}
