Почему переменные внутри функции успеха в $.AJAX выводят некорректный результат?

Question

[Мирей Аров]

Всем привет. Сразу к делу :

for (i=0;i < engol; i++){

title = $('.engine-go[data-index='+i+']>h2').html();
engineGo = $('.engine-go[data-index='+i+']').html();
console.log(title);console.log(engineGo);

$.ajax({
url: 'handler.php',
type: 'post',
dataType: 'html',
data: {
query: 'engineInfo',
title: title
},
success: function (data){
console.log(title);console.log(engineGo);
}
})
}
@@@@@@@@@@@@@@@

console.log(title);console.log(engineGo); -

- Этот кусок кода работает, как должен, только в верхней части кода, на 5 строке. А внутри результирующей функции $.ajax выводит в консоль только последнее значение из массива, проработанное в цикле, при том что сам $.ajax расположен внутои цикла.Если в массиве 14 элементов, наверху он выдаст все 14 разных элементов(как и надо), а внутри функции выдаст 14 одинаковых(последнее значение). Пробовал вынести функцию выше, не делая ее анонимное. Пробовал создавать еще 1 цикл внутри этой функции (значения даются разные, но их 14х14 = 196). Много чего еще пробовал, все без адекватного результата.

Подскажите пожалуйста, как вызвать нужный мне элемент внутри результирующей функции $.ajax. Иначе просто не вставить нужное значение из базы.

Благодарю заранее.

Answer 1

[Андрей]

Как это работает: ты запустил цикл, запустил ajax, а работает он асинхронно и цикл не ждёт ответа, он сразу идёт дальше, а ответы потом отработает тот колбэк, который ты в success передал.
Если все реально так и должно работать в цикле, то решение одно - async: false добавь в тот объект, который в $.ajax() передашь

Comments

[Мирей Аров]

Огромное тебе спасибо!

Answer 2

[Ihor Bratukh]

Есть вариант еще использовать замыкания:

var link = 'https://jsonplaceholder.typicode.com/todos/';
for (var i = 1; i <= 10; i++) {
	(function(index) {
		$.ajax({
			url: link + index,
			method: 'GET',
			dataType: 'json',
			success: function() {
				console.log(index);
			}
		});
	})(i);
}