Modal not Closing in ajax response

Question

I am using mdbootstrap for my project. I have check box on which i call ajax to perform some task and get response from php as 1 for success and 0 for failure. So I show modal before ajax call to show processing. modal displays but no closing in ajax response.

This is my modal code

  <div class="modal fade"  id="process" tabindex="-1" role="dialog" aria- 
 labelledby="myModalLabel" aria-hidden="true" data-backdrop="static" data- 
  keyboard="false">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <!--Content-->
        <div class="modal-content">
            <!--Body-->
            <div class="modal-body text-center mb-1">

                  <p>Please Wait</p>


            </div>
        </div>
        <!--/.Content-->
    </div>
</div>
 <script>
 status_val = 1;
 ac_no = 2;
 $('#process').modal();
  $.ajax({
      url:"reopen_account.php",
      type:"POST",
      data:{'reopen':'reopen','status_val':status_val,'ac_no':ac_no},
      success:function(output)
        {
           if (output==1) 
           {
              $('#process').modal('hide');
           }
           else{
               $('#process').modal('hide')
                alert('Error occured');
              }
        }
      }
    });
  </script>

I've used .modal('hide'); its not working out for me.Where i am going wrong.

you missed " **;** " after this --> $('#process').modal('hide') — Swati, Feb 09 '19 at 05:27

Soheil Rahmat · Accepted Answer · 2019-02-09T12:06:40.067

this problem occurs when you try to close your modal immediately after you've opened your modal and that's because the modal is not completely opened and modal status is still close.
So, In order to avoid to something like this happen again,you can set timeout to make sure your modal has completely opened!

$('#process').modal();
        $(document).ready(function () {
            $.ajax({
                url: "reopen_account.php",
                type: "POST",
                data: {'reopen': 'reopen', 'status_val': status_val, 'ac_no': ac_no},
                success: function (output) {
                    if (output != 1)
                        alert('Error occured');

                    setTimeout(function () {
                        $('#process').modal('hide');
                    }, 1000);
                },
            });
        });

Modal not Closing in ajax response

1 Answers1