Spring boot - ModelAndView doesn't call another page-CodePudding

I have a Spring Boot @Controller that redirect a page after ajax call. The code doesn't show error, but the new page not appear. Bellow I shared the pice of controller's code and the js function. Does anyone know what is happen?

Controller:

@RequestMapping(value = "/openNewPage", method = RequestMethod.GET)
public ModelAndView openNewPage(@RequestParam String id, Model model) {
    ModelAndView mav = new ModelAndView();
    mav.setViewName("/newPage");
    return mav;
}

JS:

function open() {
    var table = $('#dataList').DataTable();
    $('#dataList tbody').on('click', 'tr', function() {
        ligneSel = table.row(this).data();
        var id =  ligneSel[0];
    
        $.ajax({
            url : './openNewPage',
            type: 'get',
            dataType : 'html',
            data : {
                id: id
            },
            success : function(data) {
                if (data != null) {
                    $("body").html(data);
                }
            }
        });
    });
}

CodePudding user response：

I have a Spring BOOT app that uses

I have a layout view that defines the menu, which loads another page by making a request to a Spring Controller. For example:

<a href="#" style="color: white" th:href="@{/photo}">Upload Photos</a>

When i click Upload Photos, it calls the /photo controller:

 @GetMapping("/photo")
    public String photo() {
      return "upload";
    }

Which returns the upload view in the Spring BOOT app. Using Thymeleaf templates, you can simply reference the name of the HTML file under templates in your controller, as shown in this example. Your issue looks like you are using AJAX, as opposed to using a menu item to reference the controller.

See this example for a complete tutorial:

https://spring.io/guides/gs/serving-web-content/

CodePudding user response：

Simply naming the view will not redirect. Try adding redirect: prefix when you create the ModelAndView:

@RequestMapping(value = "/openNewPage", method = RequestMethod.GET)
public ModelAndView openNewPage(@RequestParam String id, Model model) {
    ModelAndView mav = new ModelAndView("redirect:/newPage");
    return mav;
}

Also, in your JS you are making a get request and getting a ModelAndView object.

This is not going to redirect the page to the ModelAndView.

AJAX is typically used like this to interact with a RESTful service which you can do a GET request and display data on the page in an async fashion - without needing to leave the page.

Spring has ModelAndView class in the MVC (Model-View-Controller) framework which follows the MVC pattern. The Model and View are resolved server-side (Java) and then served to the client as opposed to fetching the data client side (web browser, JS).

If you want to redirect client-side (from the browser, JS) then add this to your javascript:

window.location.href = '/newPage';

You need to have the /newPage endpoint defined in your controller for this to work.

Try this:

@Controller
@RequestMapping("/")
public class RedirectController {
    
    @GetMapping("/redirectWithRedirectPrefix")
    public ModelAndView redirectWithUsingRedirectPrefix(ModelMap model) 
    {
        model.addAttribute("attribute", "redirectWithRedirectPrefix");
        return new ModelAndView("redirect:/redirectedUrl", model);
    }
}

CodePudding user response：

My problem is the ajax call to spring boot controller does not redirecting a new view. The answer is that we need to call the controller twice.

This post will explain better the solution : Ajax call to spring boot controller to redirecting a view .

Thanks for all that helped me in this issue.

The exemple below show the solution:

1) First controller:

@RequestMapping(value = "/openNewPage", method = RequestMethod.GET)
public ModelAndView openNewPageController1(@RequestParam String id, Model model) {
    ModelAndView mav = new ModelAndView("/newPage");
    return mav;
}

2) Second controller:

@RequestMapping(value = "/openNewPage", method = RequestMethod.GET)
public ModelAndView openNewPageController2(@RequestParam String id, Model model) {
    ModelAndView mav = new ModelAndView("/newPage");
    return mav;
}

3) The javaScript:

function open() {
    var table = $('#dataList').DataTable();
    $('#dataList tbody').on('click', 'tr', function() {
        ligneSel = table.row(this).data();
        var id =  ligneSel[0];
    
        $.ajax({
            url : './openNewPage',
            type: 'get',
            dataType : 'html',
            data : {
                id: id
            },
            success : function(data) {
                window.location.href = "/openNewPage?id=" id;
            }
        });
    });
}