SpringMVC 3.x

博文目录

使用Ajax发出delete请求
重定向传值问题

使用Ajax发出非get,post请求！

我们知道浏览器只能发出get,post请求，但是我们可以通过Ajax来实现发出put,delete等请求，我们以最简单的例子来演示一下!

我们将上篇博文中的删除改成ajax请求删除！

我们在我们的user.jsp页面引入jquery.js，使用jquery来发出ajax请求：
user.jsp页面修改如下：（只改动删除的a标签和script部分）

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>用户列表</title>
  </head>
  <body>
    <h1>用户列表--<a href="/user/add">添加用户</a></h1>
    <ul>
    	<c:forEach items="${userList }" var="user">
    		<li>用户名：${user.username }----密码：${user.password }----<a href="/user/edit/${user.id}">修改用户</a>----<a href="javascript:;" class="del" ref="${user.id }">删除用户</a></li>
    	</c:forEach>
    </ul>
    <img alt="" src="/static/img/1.jpg">
    <script type="text/javascript" src="http://cdn.staticfile.org/jquery/1.9.1/jquery.min.js"></script>
    <script>
    	$(function(){
    		$(".del").click(function(){
    			var id=$(this).attr("ref");
    			$.ajax({
    				type:"delete",
    				url:"/user/del/"+id,
    				success:function(e){
    					alert(e);
    				}
    			});
    		});
    	});
    </script>
  </body>
</html>

将我们的UserController里的del方法改动如下：

@RequestMapping(value="/del/{id}",method=RequestMethod.DELETE)
@ResponseBody
public String del(@PathVariable Integer id){
	userService.del(id);
	return "1";
}

返回给页面的是json数据！！启动服务器，删除对象，会弹出1。
注意：ajax请求，页面是不刷新的，删除后的用户仍然在页面，但是已经不再数据库了，刷新页面，刚才删除的用户才会消失。

最后补充说一点：
重定向到一个方法上时，如何给页面传值，我们知道，经过model传值是request空间传值，重定向值就消失了。
我们使用一个新的对象来进行重定向的传值：（RedirectAttributes）
我们以add方法为例：

@RequestMapping(value="/add",method=RequestMethod.POST)
public String add(@Valid User user,BindingResult bindingResult,RedirectAttributes redirectAttributes){
	if(bindingResult.hasErrors()){
		return "user/add";
	}
	userService.save(user);
	redirectAttributes.addFlashAttribute("message", "数据更新成功");
	return "redirect:/user";
}

值可以直接传到user.jsp，使用EL表达式接收即可！！

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>用户列表</title>
  </head>
  <body>

	<!--跨页面传值message-->
	<h1>${message }</h1>
    <h1>用户列表--<a href="/user/add">添加用户</a></h1>
    <ul>
    	<c:forEach items="${userList }" var="user">
    		<li>用户名：${user.username }----密码：${user.password }----<a href="/user/edit/${user.id}">修改用户</a>----<a href="javascript:;" class="del" ref="${user.id }">删除用户</a></li>
    	</c:forEach>
    </ul>
    <img alt="" src="/static/img/1.jpg">
    <script type="text/javascript" src="http://cdn.staticfile.org/jquery/1.9.1/jquery.min.js"></script>
    <script>
    	$(function(){
    		$(".del").click(function(){
    			var id=$(this).attr("ref");
    			$.ajax({
    				type:"delete",
    				url:"/user/del/"+id,
    				success:function(e){
    					alert(e);
    				}
    			});
    		});
    	});
    </script>
  </body>
</html>

SpringMVC_3.x_入门指南_6

SpringMVC 3.x

相关推荐