<!-- $o=System::class --> <div class="modal fade" id="file-contents" tabindex="-1"> <div class="modal-dialog modal-lg modal-dialog-scrollable"> <div class="modal-content bg-dark"> <div class="modal-header bg-success"> <h5 class="modal-title text-light">Summary File Contents for <span id="file"></span></h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> <i id="spinner" class="spinner-grow spinner-grow-sm d-none"></i> <div id="modal-content"></div> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button> </div> </div> </div> </div> @section('page-scripts') <script> var file = new bootstrap.Modal(document.getElementById('file-contents'), {}); $(document).ready(function() { $('.files').click(function(e) { var item = this; var icon = $('#spinner'); $('span#file').html(e.target.innerText); file.show(); $.ajax({ type: 'POST', data: {date: e.target.innerText.replace(/\s/,'@'),_token: '{{csrf_token()}}'}, beforeSend: function() { icon.toggleClass('d-none'); $('#file-contents').find('div#modal-content').empty(); }, success: function(data) { icon.toggleClass('d-none'); $('#file-contents').find('div#modal-content').html(data); }, error: function(e) { icon.toggleClass('d-none'); alert('That didnt work? Please try again....'); }, url: '{{ url('file/contents',['o'=>$o->id]) }}/'+e.target.innerText.replace(/\s/,'@'), cache: false }) return false; }); }); </script> @append