Modal is not getting closed when opened through jquery

Viewed 36

Here i want to open modal using Jquery and the modal is getting opened correctly but the modal is not getting closed and but when using data-target the modal is getting closed..please help me to solve

 <button type="button" class="btn btn-info upload_notify_modal" data-toggle="modal" data dismiss="modal" data-backdrop="false">
         <i class="fas fa-plus"></i>
 </button>

<div class="modal" id="myModal" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
           <form action="/admin/update-access-upload-and-notification" method="POST">
                @csrf
                <!-- Modal Header -->
              <div class="modal-header">
                  <h4 class="modal-title">UPDATE UPLOAD AND NOTIFICATION</h4>
                  <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <!-- Modal body -->
                <div class="modal-body">
                </div>
                <!-- Modal footer -->
                <div class="modal-footer">
               
                  <button type="submit" class="btn btn-success" >Save</button>
                  <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
             </div>
          </form>
       </div>
     </div>
  </div>

Here is the script

<script>
$('.upload_notify_modal').click(function(){
    $('#myModal').modal('show');
})
1 Answers

<button type="button" class="btn btn-info upload_notify_modal" data-toggle="modal" data dismiss="modal" data-backdrop="false">
         <i class="fas fa-plus"></i>
 </button>

<div class="modal" id="myModal" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
           <form action="/admin/update-access-upload-and-notification" method="POST">
                @csrf
                <!-- Modal Header -->
              <div class="modal-header">
                  <h4 class="modal-title">UPDATE UPLOAD AND NOTIFICATION</h4>
                  <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <!-- Modal body -->
                <div class="modal-body">
                </div>
                <!-- Modal footer -->
                <div class="modal-footer">
               
                  <button type="submit" class="btn btn-success" >Save</button>
                  <button type="button" id="btn-close-modal" class="btn btn-danger" data-dismiss="modal">Close</button>
             </div>
          </form>
       </div>
     </div>
  </div>


<script>

 //For Open Modal
 $('.upload_notify_modal').on('click',function(){
    $('#myModal').modal('show');
 });

 // For Close Modal
 $("#btn-close-modal").on('click',function(){
     $('#myModal').modal('hide');
 });

</script>

Related