如何在Spring Web MVC中使用Ajax JQuery

我在我的应用程序中使用Spring Web MVC。

我的JSP视图中有1个下拉列表,来自以下请求savegroup.htm

           

JSP页面有:

 
Group Name :

Domain List :

现在我的要求是,在我的下拉列表的更改事件中,我想从服务器获取相关用户并在某个列表框中显示该用户列表。

为此我怎么能使用jQuery AJAX调用?

我应该在哪里处理接收请求和获取相关用户的服务器端代码?

如何在我的JSP中显示即将到来的用户组?

有很多方法可以解决这个问题。 在我给你扎实的指导之前,我需要一些问题的答案。

对于ajax请求,您是否偏好XML vs JSON?

有一点需要注意 – 没有任何关于我要告诉你的事情的具体内容。 您需要以对jquery(理想情况下为XML或json)有用的forms发回对jquery异步请求的响应,但在服务器端,它看起来像普通请求,恰好使用呈现XML的视图或者json而不是html。 我个人的偏好是使用JSON,特别是因为spring-json包工作得很好,一旦你理解它的工作原理就很容易使用。 我推荐使用http://spring-json.sourceforge.net/提供的spring-json软件包。阅读所有文档,你应该非常清楚它是如何工作的。

在最基本的forms中,您的解决方案需要执行以下操作:

配置一个使用spring-json视图noe的视图。 在大多数情况下,我更喜欢sojoView。

向服务器发出异步请求,该请求将返回用户列表。 如果提供用户集所需的唯一信息是下拉列表的选定值,那么在查询字符串中发出包含所选域的GET请求将非常简单。 在服务器端,您需要一个控制器,该控制器将映射到传入请求,并将发送回json或xml以由jquery处理。 基本上,您可以编写一个完全正常的控制器,无论是通过GET还是POST方法访问,并在返回json视图的名称之前将用户列表添加到模型中。 spring-json提供的3种类型的json视图将列表中的bean呈现为json结构并将其发送到客户端。 您可以使用所有标准DataBinderfunction来解析/转换传入参数,任何validation错误都会在json响应中生成字段或全局错误消息,客户端代码可以向用户显示这些消息。

在最简单的情况下,我的代码看起来像这样(这是所有spring2.5。它使用注释,但您可以在应用程序上下文中使用xml配置执行相同的操作。):

 @Controller public class AjaxController { @RequestMapping("/some/path/selectDomain.json", method=RequestMethod.GET) public ModelAndView processDomainSelection(@RequestParam(value="domain", required="true") String selectedDomain) { List users = service.loadUsersForDomain(selectedDomain); ModelAndView mv = new ModelAndView("sojoView", "users", users); return mv; } } 

如果我想通过POST请求进行处理,并且我希望从提交的domainValue加载一个实际的Domain对象,我可以这样做一些

 @Controller @RequestMapping("/some/path/selectDomain.json") public class SelectDomainController { public class FormBean { protected Domain domain; public Domain getDomain() { return domain; } public void setDomain(Domain domain) { this.domain = domain; } } @ModelAttribute("command") public FormBean getCommand() { return new FormBean(); } @InitBinder public void initBinder(WebDataBinder binder, WebRequest request) { // this custom editor knows how to load a Domain object from the domainValue string // if it fails to convert, it can throw an exception, which will result in // an error being logged against the "domain" field binder.registerCustomEditor(Domain.class, "domain", new DomainLookupEditor(domainService)); } @RequestMapping(method=RequestMethod.POST) public String selectedDomain(@ModelAttribute("command") FormBean command, BindingResult result, Model model, HttpServletRequest request) { if (result.hasErrors()) { return "sojoView"; } Domain domain = command.getDomain(); List users = domain.getUsers(); model.addAttribute("users", users); return "sojoView"; } } 

要发出ajax请求,可以使用jquery ajaxForm模块。 假设你有一个id为“selectDomainForm”的表单,你需要看起来像这样的js:

 function selectDomainSuccessHandler(json) { // it is possible to send back a 200 response after failing to process the request, // in which case, the sojoView will have set success=false in the json if (json.success == true) { // parse json here and render it into html in your document } else { // get field error and global error from json and present to user } } function(selectDomainErrorHandler(xhr, returnCode) { // do something based on the return code } var options = { success: selectDomainSuccessHandler, error: selectDomainErrorHandler, dataType: 'json' }; $('selectDomainForm').ajaxForm(options); 

您可以查看ajaxForm模块的文档,以了解如何发布而不是获取并仅发送抓取某些字段并将其发送到不是表单的预期URL的URL。

要显示页面中的用户列表,您的代码中将有一个id为“userList”的div,您可以在返回的json中迭代用户,为每个用户创建html。 只需将html添加到“userList”div,它就会出现在浏览器中。

定义URL的控制器

如果要使用POST方法:

 content.load('URL(.)or(#)sectionToLoad', {}, function(event) { ... }); 

或者,如果你想使用GET方法:

 content.load('URL(.)or(#)sectionToLoad', function(event) { ... }); 

使用.submit.submit等函数调用它

就是这样