student-admission/resources/views/web/layouts/modal.blade.php

 <div class="modal modal-slide-in sidebar-todo-modal fade modal_page" id="modal_page1">
  <div class="modal-dialog sidebar-lg">
      <div class="modal-content p-0">
        <div class="modal-header align-items-center mb-1">
          <h5 class="modal-title change-password-title" id="modal_page_title"></h5>
          <div class="todo-item-action d-flex align-items-center justify-content-between ms-auto"> 
              <i data-feather="x" class="cursor-pointer" data-bs-dismiss="modal" stroke-width="3"></i>
          </div>
        </div>
        <div class="modal-body flex-grow-1 pb-sm-0 pb-3" id="modal_page_body">
        </div> 
      </div>
  </div>
</div> 


{{-- <div class="apply-modal modal_page mt-2">
  <div class="apply-modal-content apply-animate-top apply-card-4 mb-4">
      <header class="container apply-teal mb-3 mt-4"> 
          <span class="w3-button w3-display-topright">&times;</span>
          <h5 class="mt-3 p-3" style="font-weight: bold;" id="modal_page_title"></h5>
      </header>
      <div id="modal_page_body">
      </div> 
  </div>
</div> --}}


@push('js')  
<script type="text/javascript">  
//Start of jquery
$(function(){ 

  $('.open_modal_page').on('click', function(){  
    let url=$(this).data('url');
 
    let title=$(this).data('title');

    if(!title) title='Modal Form';

    $('#modal_page_title').html(title); 
    $('.modal_page').modal({show:true});

    $('#modal_page_body').load(url, null, function(){
      $('.tooltips').tooltip();
    });

  });
   
  $('.tooltips').tooltip();
 

});
//End of jquery
</script>
@endpush