Как загрузить template по другому url без перезагрузки страницы в Thymeleaf?

Question

[postya]

Мне нужно,чтобы при нажатии на кнопку появилось всплывающее модальное окно с другим темплейтом, но при этом текущая html страница оставалсь

В темплейте у меня ест кнопка, которая вызывает метод в контроллере:

<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;
  }

при клике на кнопку менятся url на другой и вызывается другой темплейт
Как сделать,чтобы при смене url не происходила перезагрузка страницы?

Может подскажете какие либо туториалы по созданию модальных окон в thymeleaf

Answer 1

[Орхан Гасанлы]

Здравствуйте!

при клике на кнопку менятся url на другой и вызывается другой темплейт

Изучите технологию ajax. А также SPA (single page application)

всплывающее модальное окно с другим темплейтом

можно просто отправить ajax запрос на сервер. Вернуть шаблон у уже подставленными значениями и показать модальное окно