Как показывать модальные данные до тех пор, пока они не будут готовы в вызове ajax?

#jquery #ajax

Вопрос:

Я хочу использовать модальную загрузку до тех пор, пока не поступят данные. Я пытаюсь использовать beforeSend (), чтобы показать модальный snd complete (), чтобы скрыть модальный, но это не работает. Модальный-это показать, но когда данные готовы, модальный не скрывается

это моя кнопка

 <a href="Javascript:void(0);" id="LinkUser" class="nav-link align-middle px-0">User</a>
 

Данные будут отображаться здесь в #showTable

 <div class="col py-3">
     <div class="container scroll-x" id="showTable">

            
     </div>
     <div class="modal fade loading" id="loading" data-bs-keyboard="false" tabindex="-1" aria-labelledby="loading" aria-hidden="true">
          <div class="modal-dialog  modal-dialog-centered">
               <div class="modal-content">
                    <div class="modal-body">
                           Loading....
                    </div>
                </div>
           </div>
      </div>
</div>
 

Это вызов ajax

 $(document).ready(function() {
    $('#LinkUser').click(function(e) {
        e.preventDefault();
        $.ajax({
            type: "POST",
            url: "usertable.php",
            beforeSend: function(){
                $('#loading').modal('show');
            },
            success: function(result) {
                $('#showTable').load('usertable.php');
                // $('#showTable').html(result);
            },
            complete:function(){
                $('#loading').modal('hide');
            }
        });
    });
});
 

Комментарии:

1. где ваши функции beforeSend() и complete()?

2. Извините, сэр, я отредактировал его