onclick внутри Ajax звонок

Question

У меня есть вызов ajax, который в случае успеха создает элемент. При щелчке по элементу должен отображаться вращающийся gif, пока выполняется другое действие (создание jquery таблиц данных). Тогда гифка должна исчезнуть. В моем случае все работает, за исключением того факта, что gif загружается после создания jquery datatables и поэтому отображается очень кратко. Я хочу, чтобы он запускался, как только я щелкаю элемент, но это не так.

ajax{
element.create();
element.click(){
      startLoadingGif();

      drawJqueryDataTables();

      stopLoadingGif();
}
}

Буду признателен за любую помощь.

Answer 1

Что вам нужно сделать, это вот что. startLoadingGif() до выполнения запроса и stopLoadingGif(); после завершения (успешного или неудачного) запроса:

   startLoadingGif();
     $.ajax({
      ...
      complete: function (data) {
          stopLoadingGif()
        }
     });

ОБНОВЛЕНИЕ:

$.ajax({
      ...
      complete: function (data) {
           element.create();
           element.click()
           startLoadingGif();
           drawJqueryDataTables(); //Or you can make this a promise if it takes a longer time and after that is resolved you can stop the spinner. Or,
           window.setTimeout(()=>{
             stopLoadingGif();
           }, 2000)

     });