Spring3 MVC中Ajax的使用

来源：http://hhdem.com/2012/01/30/spring3-mvc-ajax-sample/

现在已经开始使用Spring3了，MVC虽然用了很久不过Ajax一直通过DWR实现，不过既然Spring3已经支持Ajax访问，那就必须折腾下了。

1. 首先，新建Controller类用于接收ajax请求，这里建立AjaxCheckController，目的是检查注册用户是否已经存在

01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

@Controller @RequestMapping ( "/a" ) public class AjaxCheckController extends BaseController { @Autowired private UserManager userManager; @RequestMapping (value = "/checkexists/loginname/{loginName}" , method = RequestMethod.GET) public @ResponseBody Map<String, Object> checkLoginNameExists( @PathVariable String loginName) { User user = userManager.findUserByLoginName(loginName); Map<String, Object> modelMap = new HashMap<String, Object>(); modelMap.put( "exists" , user != null ); return modelMap; } @RequestMapping (value = "/checkexists/email" , method = RequestMethod.GET) public @ResponseBody Map<String, Object> checkEmailExists( @RequestParam (value = "email" , required = true ) String email) { User user = userManager.findUserByEmail(email); Map<String, Object> modelMap = new HashMap<String, Object>(); modelMap.put( "exists" , user != null ); return modelMap; } }

2. 请求页面，在这里就是注册页面了，部分js代码如下：

01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59

function loginOnChange(event) { .... $.ajax({ type : 'GET' , contentType : 'application/json' , url : 'a/checkexists/loginname/' +loginname, dataType : 'json' , success : function (data) { if (data && data.exists) { log_tip_div.style.display = "inline" ; log_tip.innerHTML= "<img src='<@common.basePath/>/img/exclamation.gif'/> 该用户名已经被使用" ; canSub = false ; loginUserError = true ; isLoginUserExists = true ; } else { log_tip_div.style.display = "inline" ; log_tip.innerHTML= "<img src='<@common.basePath/>/img/fit.gif'/> 用户名可以使用" ; canSub = true ; loginUserError = false ; isLoginUserExists = true ; } }, error : function () { alert( "error" ) } }); ..... } function emailOnChange(event) { .... $.ajax({ type : 'GET' , contentType : 'application/json' , url : 'a/checkexists/email' , data: 'email=' +email, dataType : 'json' , success : function (data) { if (data && data.exists) { email_tip_div.style.display = "inline" ; email_tip.innerHTML= "<img src='<@common.basePath/>/img/exclamation.gif'/> 该邮箱已经注册过" ; canSub = false ; emailError = true ; isEmailExists = true ; } else { email_tip_div.style.display = "inline" ; email_tip.innerHTML= "<img src='<@common.basePath/>/img/fit.gif'/> 邮箱未被注册过,可以使用" ; canSub = true ; emailError = false ; isEmailExists = true } }, error : function () { alert( "error" ) } }); .... }

到此就可以了，可以通过jquery轻松访问Spring的Controller，是不是很简单呀！