Modal page modified

app/Http/Controllers/ModalController.php

@@ -0,0 +1,57 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+use App\Http\Controllers\Controller; 
+use App\Models\Admin;
+use Hash;
+use DB;
+use Session;
+
+class ModalController extends Controller{
+
+    public function get(Request $req, $name){
+       // $user = \Auth::guard('admin')->user();
+        $carbon=new \Carbon\Carbon;
+
+        $data=[
+            'name'=>$name,
+            'carbon'=>$carbon
+        ];
+
+        if($name=="apply_student_proposal"){
+            
+        } else $name='default';
+
+        return view("modal_pages.{$name}", $data);
+    }
+
+    public function post(Request $req, $name){
+
+        $user=\Auth::user();
+        $carbon=new \Carbon\Carbon;
+
+        if($name=='admin_change_password'){
+
+            $validator=\Validator::make($req->all(), [
+                'password'=>'min:4|required_with:confirm_password|same:confirm_password',
+                'confirm_password'=>'min:4',
+            ]);
+
+            if($validator->fails()){
+
+                $errors=$validator->errors()->all();
+                return response(['msg'=>$errors[0]], 422);
+            }
+
+           
+            return response(['msg'=>'Password saved successfully']);
+
+        } 
+
+        return response(['msg'=>'No name argument found.'], 403);
+
+    }
+
+}

resources/views/modal_pages/apply_student_proposal.blade.php

@@ -0,0 +1,66 @@
+@extends('modal_pages.base')
+
+@section('main')
+<form class="ajax-form" action="{{ url()->current() }}" method="POST" enctype="multipart/form-data">
+    {{ csrf_field() }}
+    <div class="container mt-4">
+        <div class="col-md-12 p-3" style="background-color:white; border-radius:6px;">
+            <p style="margin:0px; font-size:14px;">Select propose start date</p>
+            <div class="row">
+                <div class="col-md-6">
+                    <div class="mb-1">
+                            <label class="form-label"></label>
+                        <div class="form-icon position-relative">
+                            <select name="startdate" id="start date" class="form-control frm" required="">
+                                <option disabled="" selected="" value="">Year</option>
+                                @php
+                                    $firstYear = (int)date('Y') - 20;
+                                    $lastYear = $firstYear + 20;
+                                    for($i=$firstYear;$i<=$lastYear;$i++){
+                                @endphp
+                                <option value="{{$i}}">{{$i}}</option>
+                                @php
+                                    }
+                                @endphp
+
+                            </select>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-md-6">
+                    <div class="mb-1">
+                            <label class="form-label"></label>
+                        <div class="form-icon position-relative">
+                            <select name="startmonth" id="month" class="form-control frm" required="">
+                                <option disabled="" selected="" value="">Month</option>
+                                <option value="01">January</option>
+                                <option value="02">February</option>
+                                <option value="03">March</option>
+                                <option value="04">April</option>
+                                <option value="05">May</option>
+                                <option value="06">June</option>
+                                <option value="07">July</option>
+                                <option value="08">August</option>
+                                <option value="09">September</option>
+                                <option value="10">October</option>
+                                <option value="11">November</option>
+                                <option value="12">December</option>
+                            </select>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="col-md-12 text-end">
+            <button type="submit" class="btn btn1 mt-3 mb-3" style="padding: 3px 18px;">Submit</button>
+        </div> 
+    </div>
+</form>
+
+<script>
+    $(function(){
+        // $('.select2').select2();
+        $('#modal_page_footer').hide(); 
+    });
+    </script>
+@endsection

resources/views/modal_pages/base.blade.php

@@ -0,0 +1,96 @@
+@yield('main')
+
+<script>
+	$(function(){
+	
+		$('.modal-date').flatpickr({
+			dateFormat: 'd M Y'
+		});
+	
+		$('.modal-time').flatpickr({
+			noCalendar: true,
+			enableTime: true,
+			dateFormat: "h:i K",
+		});
+	
+		$('.ajax-form').on('submit', function(event){
+	
+			event.preventDefault();
+			var self=$(this);
+	
+			$('.btn-submit').prop('disabled', true);
+	
+			   $(self).waitMe({
+				effect: 'facebook',
+				text: 'Please! Wait ...'
+			});
+			
+			$(this).ajaxSubmit({
+			  success:function(res){
+	
+				   $(self).waitMe('hide');
+	
+				if(res.msg){
+					new Noty({
+						theme:'sunset',
+						text: res.msg,
+						type: 'success',
+						timeout:1000,
+						callbacks:{
+							afterClose:function(){  
+								var replace_content=self.find('input[name=replace_content]').val();
+	
+								if(replace_content){
+	
+									url=self.find("input[name='replace_content']").data('replace');
+	
+									$(replace_content).waitMe({
+										effect: 'facebook',
+										text: 'Please! Wait ...'
+									});
+																
+									$(replace_content).load(url, null, function(){
+	
+										$(replace_content).waitMe('hide');
+	
+									});
+	
+									$('#modal_page').modal('hide');
+	
+								}else window.location.reload();
+	
+							}
+						}
+					}).show();
+				}
+	
+			  },
+			  error:function(res){
+	
+				  $(self).waitMe('hide');
+	
+				  let msg="Request submission failed. Please! try again later.";
+	
+				if(res.responseJSON && res.responseJSON.msg){
+					msg=res.responseJSON.msg;
+				}
+	
+				   new Noty({
+					theme:'sunset',
+					text: msg,
+					type: 'error',
+					timeout:3000,
+					callbacks:{
+						afterClose:function(){
+							$('.btn-submit').prop('disabled', false);
+						}
+					}
+				}).show();
+	
+			  }
+			});
+	
+		  });
+	});
+	</script>
+	

resources/views/modal_pages/default.blade.php

@@ -0,0 +1,5 @@
+@extends('modal_pages.base')
+
+@section('main')
+<h4 class="text-center mt-3">No Form Specified</h4>
+@endsection

resources/views/ref_search_load.blade.php

@@ -12,8 +12,9 @@
             </div>
 
             <div class="col-md-2 mt-3">
-                <span class="btn btn3 apply_student" data-id="{{ $row->id }}" style="margin-left: 1.1rem;" onclick="document.getElementById('id01').style.display='block'">Apply</span>  
-                <div id="id01" class="apply-modal mt-2">
+                <span class="btn btn3 open_modal_page" data-url="{{route('modal-get',['name'=>'apply_student_proposal','id'=>$row->id])}}"  data-title="Edit Circular" style="margin-left: 1.1rem;">Apply</span>  
+                {{-- <span class="btn btn3 apply_student" data-id="{{ $row->id }}" style="margin-left: 1.1rem;" onclick="document.getElementById('id01').style.display='block'">Apply</span>   --}}
+                {{-- <div id="id01" class="apply-modal 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 onclick="document.getElementById('id01').style.display='none'" 
@@ -117,7 +118,7 @@
                             </div> 
                         </div>
                     </div>
-                </div>
+                </div> --}}
             </div>
         </div>
     </div>
@@ -136,8 +137,29 @@
 
 @endif
 
+@include('web.layouts.modal')
 <script>
     $(function(){
+
+        // $('.open_modal_page').on('click', function(){ 
+             
+
+        //     let url=$(this).data('url'); 
+
+        //     let title=$(this).data('title');
+        //     alert(title);
+
+        //     if(!title) title='Modal Form';
+
+        //     $('#modal_page_title').html(title); 
+        //     $('.modal_page').modal({show:true});
+
+        //     $('#modal_page_body').load(url, null, function(){
+        //         alert('load');
+        //         $('.tooltips').tooltip();
+        //     }); 
+        // });
+
         $('.apply_student').on('click', function(e){
             e.preventDefault();
             var id = $(this).data('id');

resources/views/web/layouts/bottom.blade.php

@@ -16,10 +16,11 @@
       <script src="{{asset('web/js/plugins.init.js')}}"></script>
       <script src="{{asset('web/js/app.js')}}"></script>
       <script src="{{asset('web/css/sweetalert/sweetalert.min.js')}}"></script>
-      <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
+      {{-- <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> --}}
 
         {{-- Ajax Form Submit --}}
     
+        <script src="{{ asset('css/jquery.min.js') }}"></script>
         <script src="{{ asset('css/jquery-form/dist/jquery.form.min.js') }}"></script>
         <script src="{{ asset('css/noty/lib/noty.min.js') }}"></script>
         <script src="{{ asset('css/flatpickr/dist/flatpickr.min.js') }}"></script>

resources/views/web/layouts/master.blade.php

@@ -7,5 +7,5 @@
 @include('web.layouts.footer')
 </body>
 @include('web.layouts.bottom')
-
+{{-- @include('web.layouts.modal') --}}
 </html>

resources/views/web/layouts/modal.blade.php

@@ -0,0 +1,56 @@
+ <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

routes/web.php

@@ -103,7 +103,15 @@ Route::group(['middleware' => ['admin']], function() {
 });
 
 
-
+Route::get(
+    'modal/{name}',
+     'ModalController@get'
+    )->name('modal-get');
+Route::post(
+    'modal/{name}',
+     'ModalController@post'
+     )->name('modal-post');
+     
 Route::get(
 	'ajax/{name}',
 	'AjaxController@get'