How to load template from different url without page reload in Thymeleaf?

Question

Spring

I need a pop-up modal window with a different template to appear when the button is clicked, but the current html page remains
. In the template, I have a button that calls a method in the controller:

<a data-modal-target="#modal" th:href="@{'/face/' + ${contact.id}}" class="view">
  <button  class="btn btn-primary"><i class="fa fa-eye"> View</i></button>
</a>

@GetMapping("/face/{id}")
  public ModelAndView viewFullFace(@PathVariable(name = "id")int id, Model model) {
    List<Contact> listContacts = contactService.getAll();
    model.addAttribute("listContacts", listContacts);
    ModelAndView mav = new ModelAndView("view_face");
    Contact contact = contactService.get(id).orElse(null);
    mav.addObject("contact", contact);
    return mav;
  }

when the button is clicked, the url changes to another one and another template is called
. How can I prevent the page from reloading when changing the url?
Can you tell me any tutorials on creating modal windows in thymeleaf

Answer 1

Hello!
Learn ajax technology. And also SPA (single page application)
you can just send an ajax request to the server. Return template with already substituted values ​​and show modal window