对 Spring Boot 控制器的 Ajax 调用以重定向视图

Question

我是 Spring Boot 框架的新手。 我有一个 jQuery 方法，它在单击 span 元素时被调用。在那个 jQuery 方法中，我有一个 ajax 调用，它调用 Spring Boot 控制器并将字符串作为参数传递。控制器正在获取从 ajax 调用传递的参数。但它并没有重定向到不同的视图。不同的视图是一个名为 ajaxView.html 的 html 页面。我也想为视图添加一个属性。任何帮助都会很棒。

这是我的 ajax 调用：

$(document).ready(function() {
$('.spanClass').on('click', '#id_1', function(event){   
     event.stopPropagation();

         var str = ((event.target.parentElement).parentElement.href);
            $.ajax({
                type: 'POST',
                url: "http://localhost:8080//span/view?term="+encodeURIComponent(str),
                contentType: 'text/plain',
                crossDomain: false,
                async:true,
                success:function(response) {        
                }
            });
  });
});

这是我的控制器方法：

@RequestMapping(method=RequestMethod.POST, value = "/span/view")
public @ResponseBody ModelAndView redirectAjax(String term, Model model) {

    Employee emp = new Employee();
    emp.setName(term);

    model.addAttribute("employee", emp);

    return new ModelAndView("redirect:/ajaxView");

}

Answer 1

您需要从您的 Ajax 成功函数中再次调用控制器来为您打开 ajaxView.html 页面。 :--

1.) 你的 ajax 调用应该是这样的：--

$.ajax({
                type: 'POST',
                url: "http://localhost:8080//span/view?term="+encodeURIComponent(str),
                contentType: 'text/plain',
                crossDomain: false,
                async:true,
                success:function(response) {  

                window.location = '/yourAjaxControllerName';
                }
            });

2.) 你的控制器：--

   @RequestMapping("/yourAjaxControllerName")
    public String getAjaxViewPage(HttpServletRequest request,Model model) {

       return "ajaxView";

     }

Answer 2

您需要在 Ajax 本身中执行此操作。

在Ajax调用成功方法中需要重新发送响应。

$(document).ready(function() {
$('.spanClass').on('click', '#id_1', function(event){   
     event.stopPropagation();

         var str = ((event.target.parentElement).parentElement.href);
            $.ajax({
                type: 'POST',
                url: "http://localhost:8080//span/view?term="+encodeURIComponent(str),
                contentType: 'text/plain',
                crossDomain: false,
                async:true,
                success:function(emp) {     
                  alert(emp);  
                  window.location.href = '/JspControllerHandler?employee='+ JSON.stringify(emp); // redirect     //this would be GET
                }
            });
  });
});

您的控制器会将员工数据返回给请求 Ajax。

@RequestMapping(method=RequestMethod.POST, value = "/span/view")
public @ResponseBody Employee redirectAjax(String term, Model model) {
    Employee emp = new Employee();
    emp.setName(term);
    return emp;
}

您的 Ajax 将负责重定向到另一个页面

  @RequestMapping("/JspControllerHandler")
    public String redirectJsp(HttpServletRequest request,@RequestParam("employee") String empStr) {
    Employee employee = null;
    try
    {
        ObjectMapper mapper = new ObjectMapper();
        employee = mapper.readValue(empStr, Employee.class);
         model.addAttribute("employee", employee );
    }
    catch(Exception ex)
    {
        System.out.println("Error while converting JSON string to employee object.");
        ex.printStackTrace();
    }
       return "jspView";
     }