templates/front/_modal_show.html.twig line 1

Open in your IDE?
  1. <div class="modal fade" tabindex="-1" aria-hidden="true" data-modal-form-target="modal" id="exampleModal">
  2.     <div class="modal-dialog ">
  3.         <div class="modal-content">
  4.             <div class="modal-header">
  5.                 <h5 class="modal-title" data-modal-form-target="modalTitle" id="my_modal_title"></h5>
  6.                 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  7.             </div>
  8.             <div id="my_modal_body" class="modal-body"
  9.                  data-modal-form-target="modalBody"
  10.                  data-action="submit->modal-form#submitForm"
  11.             >
  12.                 {{ modalContent | default('Loading...') }}
  14.                 <script type="text/javascript" >
  15.                     $('body').on('click', '.open-centered-popup', event => {
  16.                         event.preventDefault();
  18.                         const width = 400; // Specify the width of the pop-up window.
  19.                         const height = 600; // Specify the height of the pop-up window.
  20.                         const left = (window.innerWidth - width) / 2; // Calculate the left position to center the window.
  21.                         const top = (window.innerHeight - height) / 2; // Calculate the top position to center the window.
  22.                         const windowFeatures = `width=${width},height=${height},scrollbars=yes,resizable=yes,top=${top},left=${left}`;
  24.                         const url = $(this).data('url');
  25.                         console.log('url = ' + url);
  26.                         // Open the pop-up window.
  27.                         window.open(url, '_blank', windowFeatures);
  28.                     });
  29.                 </script>
  30.             </div>
  32.         </div>
  33.     </div>
  34. </div>