async: false ajax, зависает хром

287
12 декабря 2016, 10:08

Помогите обернуть ajax запрос, чтобы он выполнялся последовательно async: false подвисает браузер, пробовал обернуть в функцию, но вылетают ошибки.

          $(document.getElementById('process')).on("click", function(e) {
          if (last_date_chk > new Date().getTime()) {
              getConfirm('<div style="padding:25px"><legend style="text-align:center;padding:10px!important">Невозможно обновить данные</legend><p>С момента последнего обновления данных <b>не прошло 20 минут.</b></p><p>Попробуйте повторить действие чуть позже, либо воспользуйтесь последними полученными данными.</p></div>', function(result) {});
          } else {
              var offers = [<?php echo '"' . implode('","', $offers[0]) . '"'; ?>],
                  offersDone = 0,
                  gmtDate = new Date,
                  timeOffset = gmtDate.getTimezoneOffset() / 60,
                  localDate = (new Date(gmtDate.getTime() - 36E5 * timeOffset)).toISOString().slice(0, 19).replace('T', ' ');

              if (clkBtnProgressbar == 0) {
                  clkBtnProgressbar = 1;
                  $('.progress').animate({
                      opacity: 'toggle'
                  }, {
                      duration: 2000,
                      start: function() {
                          $(this).css('display', 'block');
                      }
                  });
                  for (i = 0; i <= offers.length; ++i) {
                      $.ajax({
                          type: 'GET',
                          url: URL_SELF,
                          async: true,
                          data: {
                              buy_product_id: offers[i],
                              buy_product_date: localDate
                          }
                      }).done(function() {
                          ++offersDone;
                          $('.progress-bar').css('width', (offersDone / offers.length) * 100 + '%').attr('aria-valuenow', (offersDone / offers.length) * 100);
                      });
                  }
              } else {
                  getConfirm('<h2 class="text-center">Ждите…</h2>', function(result) {});
              }
          }
      });
Answer 1

Элементарное решение:

var i = 0;
function query() { 
    $.ajax({
        type: 'GET',
        url: URL_SELF,
        async: true,
        data: {
            buy_product_id: offers[i],
            buy_product_date: localDate
        }
    }).done(function() {
        ++offersDone;
        $('.progress-bar').css('width', (offersDone / offers.length) * 100 + '%').attr('aria-valuenow', (offersDone / offers.length) * 100);
        if (++i < offers.length) { 
          query();
        }
    });
}
if (offers.length) query();

Немного оффтопа:
Вместо [<?php echo '"' . implode('","', $offers[0]) . '"'; ?>]
предпочтительнее использовать что-то вроде
<?php echo json_encode(array_values($offers[0]));?>

Answer 2

Я вам крайне не рекомендуя делать async: false, что-бы упорядочить ответы от сервера, можно попробовать обернуть её в $.deferred();, в трёх словах не объяснить, но есть очень хорошая статья тут: http://habrahabr.ru/post/113073/

READ ALSO
Как выполнить действие при выбранном select&#39;e?

Как выполнить действие при выбранном select'e?

Всем приветЕсть список через select

362
Как правильно закрепить header?

Как правильно закрепить header?

Работал вот в таком направлении:

287
JQuery onclick() последовательное изменение css

JQuery onclick() последовательное изменение css

Нужно чтобы, после нажатия на иконку ширина некого divcontent становилась 1000px, после повторного нажатия на иконку, размер div-а должен становиться...

288