Passing values from controller to Modal page
By reading your code I understand that you are doing an AJAX call in order to
- take values from DB
- populate HTML
- view modal
The code you wrote is syntactically correct but you are wrong in one thing... you must populate the modal HTML in the success method of the ajax callIn this case I would modify the code in the following way (I'm writing it in spring mvc way because i'm not expert of spring boot but you can adapt it to springboot code):
@RequestMapping(value = "/showarea", method = RequestMethod.POST) public @ResponseBody String areaModel() { LOG.info("/showarea"); List<Zona> zonas = zonaService.findAll(); return zonas.get(0).getNom_ZONA(); } <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">Launch demo modal</button> <!-- Modal --> <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" th:fragment="modalContents"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLabel">Modal title</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body" id="areaValue"> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> <button type="button" class="btn btn-primary">Save changes</button> </div> </div> </div> </div> <script> $('#exampleModal').on('show.bs.modal', function(event) { var button = $(event.relatedTarget) var recipient = button.data('whatever') var modal = $(this) modal.find('.modal-title').text('New message to ' + recipient) modal.find('.modal-body input').val(recipient) //I would prevent the default behaviour of the button event.preventDefault(); //AJAX Call $.ajax({ type : 'POST', url : "/showarea", success : function(data) { //Get Area name after AJAX call var nomArea = data; //Valorize HTML $("#areaValue").html(nomeArea); //Finally open popup } }); }) </script>I hope it's usefull
Angelo