JQuery AJAX проблемы с успехом триггера

Question

Я знаю, в чем моя проблема, я просто не могу найти решение.

У меня есть мастер, который в основном представляет собой 5-страничную форму. На каждой странице я выполняю различные проверки, если проверка соответствует «страница» скрыта и отображается следующая страница.

$('#wizard-2 .continue').click(function() {
  // Validation Here
  $('#wizard-2').hide();
  $('#wizard-3').show();
});

Моя проблема в том, что для одной из функций проверки требуется вызов ajax.

$.ajax({
  // Misc stuff
  success : function (bool) {
    if (bool == 0) {
      // Show Error
      return false;
    }
  }
});

То, что мне нужно сделать, - это сценарий, ожидающий завершения вызова ajax, и если функция success возвращает false, то необходимо остановить сценарий.

Если бы я использовал реальную форму, я бы поместил форму отправки в функцию успеха и предотвратил действие по умолчанию сразу после ajax. Очевидно, что это не сработает, так как форма не должна быть отправлена ​​до тех пор, пока не будет завершена последняя страница мастера.

Есть идеи?

Answer 1

Я бы попробовал так:

1) Определить функцию для выполнения проверки, которая также ожидает параметр типа функции для обратного вызова.

2) В событии click вызовитефункция проверки с функцией, которая должна выполняться при успешном событии.

Что-то вроде:

$('#wizard-2 .continue').click(function () {
    // Validation Here   
    processWizard(function(){
        $('#wizard-2').hide();
        $('#wizard-3').show();
    });

});

function processWizard(callback){
    $.ajax({   
        // Misc stuff   
        success : function (bool) {     
            if (bool == 0) {       
                // Show Error       
                return false;     
            }   
            else{
                callback();
            }
        } 
    }); 
}

Answer 2

AJAX является асинхронным;Вы не можете сделать это.

^{Технически, вы можете, но это приведет к зависанию браузера; не .}

Вы должны изменить свой валидатор на обратный вызов вместо того, чтобы возвращать bool:

function validate(callback){    
    $.ajax({
        success : function (bool) {
            if (bool == 0) {
                //Do soemthing
                callback(false);
            } else
                callback(true);
        }
    });
}

Answer 3

Вы можете попробовать внутри вашего .ajax-вызова установить async: false, чтобы предотвратить вызов асинхронно.Конечно, это замедлит работу вашей страницы, но это один из вариантов.

Другой вариант - поместить материал после проверки, выполняющей вызов ajax, в функцию, которую вы вызываете в случае успеха.Не зная, что это, я не могу набросать точный вариант, но, конечно,

$('#wizard-2').hide();
$('#wizard-3').show();

будет частью этого.

Answer 4

Можете ли вы поместить свой скрывающий / показывающий код в функцию обратного вызова для этого успешного вызова AJAX?Таким образом, только если он вернется успешно, он покажет следующую страницу в «форме».

По сути, AJAX - это асинхронный вызов, поэтому лучший способ добиться чего-либо, когда вызов возвращается, - это либо разместить егоили вызвать его из функции обратного вызова.