Присвоение переменной из jQuery ajax call возвращает undefined

Я новичок в jquery, и я пытаюсь присвоить значение переменной после вызова ajax, но возвращает undefined. Мой код ниже:

function prepareDocument() {
var a = getAverageRating(1);
alert(a);
}
function getAverageRating(pageId) {
$.ajax({
    url: "../services/rating.ashx?action=getAverageRating&pageId=" + pageId,
    dataType: "text",
    type: "GET",
    data: {},
    error: function (err) {
        displayDialogBox("Error", err.toString());
    },
    success: function (data) {
        return data;
    }
});
}

Любая помощь будет оценена по достоинству. Спасибо,

Ответ 1

Это очень распространенная проблема для людей, не использующих асинхронные операции. Это требует от вас переосмыслить, как вы структурируете свой код, потому что вы не можете просто программировать в обычном последовательном стиле.

Вы не можете вернуть значение из обработчика успеха асинхронного вызова ajax. Ajax cll уже давно завершен и уже вернулся. Возврат значения из обработчика успеха просто попадает в недрах кода ajax, а не обратно в ваш код.

Вместо этого вы должны использовать результаты вызова ajax в обработчике успеха или в функции, которую вы вызываете из обработчика успеха.

В вашем конкретном случае ваша функция getAverageRating(), вероятно, должна принять функцию обратного вызова, и когда рейтинг будет восстановлен, будет вызвана функция обратного вызова. Он не может вернуть значение, потому что он возвращается немедленно, а затем некоторое время в будущем, вызов ajax завершается, и обработчик успеха в функции ajax вызывается с фактическими данными.

function prepareDocument() {
    getAverageRating(1, function(data) {
        alert(data);
    });
}

function getAverageRating(pageId, fn) {

    $.ajax({
        url: "../services/rating.ashx?action=getAverageRating&pageId=" + pageId,
        dataType: "text",
        type: "GET",
        data: {},
        error: function (err) {
            displayDialogBox("Error", err.toString());
        },
        success: function (data) {
            fn(data);
        }
    });

}