Проверить завершение вызова ajax

Question

У меня возникла проблема с заполнением и доступом к глобальной переменной с помощью ajax. У меня есть следующий код (урезанный немного):

var answers; 

$(document).ready(function() { 

    showResults(); 

    console.log(answers); 

} 

function showResults(){ 
    $.ajax({ 
     url: "/wp-content/themes/hoekiesikeenschool/question-storage.php", 
     data: { action: "get_results" }, 
     type: "post", 
     dataType: "json" 
    }).done(function (data) { 

     answers = data.questionary; 
     return answers; 

    }); 
} 

Мой вопрос заключается в следующем: Когда я вхожу answers в функции done это дает мне хороший массив. Это означает, что переменная array заполнена. Но когда я регистрирую его с $(document).ready, он возвращает пустую переменную. Вероятно, это связано с тем, что вызов AJAX является асинхронным, и журнал запускается до заполнения переменной.

Однако мне нужно использовать эту переменную на другой странице, поэтому мне нужно получить к ней доступ от $(document).ready ... Любая идея о том, как проверить, заполнена ли переменная? Или когда завершается showResults()? Заранее спасибо за вашу помощь!

• Edit -

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

Таким образом, я заканчиваю wit showResults(); в doc.ready, который затем выполняет множество функций, которые все «связаны» вместе. В любом случае, я могу вернуть данные в переменную, для использования в других местах? Надеюсь, я сделал это ясно, английский не мой родной язык, извините.

Answer 1

Проверьте документацию на успех: это будет выполнено только при успешном завершении обратного вызова.

var answers; 

$(document).ready(function() { 
    showResults(); 
} 

function showResults(){ 
    $.ajax({ 
     url: "/wp-content/themes/hoekiesikeenschool/question-storage.php", 
     data: { action: "get_results" }, 
     type: "post", 
     dataType: "json" 
    }).when(function (data) { 
     console.log(answers); 
     answers = data.questionary; 
     return answers; 

    }); 
} 

Answer 2

Выполнить функциональность, которая зависит от answers массива после вызова AJAX. Позвоните в функцию из done(..)

очень грубая мысль:

var answers; 

function functionalityDependentOnAnswers() { 
    //the code dependent on answers array. 
} 

$(document).ready(function() { 

    showResults(); 

    //Move code here to functionalityDependentOnAnswers() 
} 

function showResults(){ 
    $.ajax({ 
     url: "/wp-content/themes/hoekiesikeenschool/question-storage.php", 
     data: { action: "get_results" }, 
     type: "post", 
     dataType: "json" 
    }).done(function (data) { 

     answers = data.questionary; 
     functionalityDependentOnAnswer(); 

    }); 
} 

Answer 3

Вы можете использовать when метод, предоставленный JQuery (смотрите на this SO link).

Или посмотрите at this SO link, где объясняется аналогичная ситуация.

Answer 4

Вы в правильном направлении.

Делайте материал с ответами внутри обратного вызова DOM.

var answers; 
$(document).ready(function() { 
    showResults(); 
} 

function showResults(){ 
    $.ajax({ 
     url: "/wp-content/themes/hoekiesikeenschool/question-storage.php", 
     data: { action: "get_results" }, 
     type: "post", 
     dataType: "json" 
    }).done(function (data) { 
     answers = data.questionary; 
     console.log(answers); 
     // Manage answers here 
    }); 
} 

Answer 5

Идея: Введите скрытое поле ввода и добавьте к нему прослушиватель изменений.

<input type="hidden" id="answers_input" /> 

Теперь у вас есть слушатель.

var answers; 

$(document).ready(function() { 
    $('#answers_input').on('change', function() { 
    // trigger your custom code 
    console.log(answers); 
    }) 
    showResults(); 

    console.log(answers); 

} 

function showResults(){ 
    $.ajax({ 
     url: "/wp-content/themes/hoekiesikeenschool/question-storage.php", 
     data: { action: "get_results" }, 
     type: "post", 
     dataType: "json" 
    }).done(function (data) { 
     answers = data.questionary; 
     $('#answers_input').val(answers); 
    }); 
} 

Решение вроде как взломать, дайте мне знать, если это работает для вас