Глобальные переменные с помощью jQuery

Question

Глобальные переменные с помощью jQuery

Только что получил FooTable адаптивный плагин таблицы для работы. Сейчас я пытаюсь настроить PHP-скрипт для извлечения PostgreSQL и возврата JSON-кодированного массива.

Пока все работает нормально. Я действительно близок к тому, чтобы заставить работать этот скрипт jQuery, но я не уверен, почему мои переменные не передаются.

Вот сценарий:

  var columns_json;
var rows_json;

jQuery(function($){

$.ajax(
{
type: "POST",
dataType:"JSON",
url: "a.php",
data: {action: 'test'},

success: function(data)
{
columns_json = data[0];
rows_json = data[1];

console.log(columns_json);
console.log(rows_json);
},

failure: function(data)
{
alert("Something went wrong");
}
});

$('.table').footable(
{

"paging": {"enabled": true},

"filtering": {"enabled": true},

"sorting": {"enabled": true},

"columns": columns_json,

"rows": rows_json

});
});

Если я посмотрю на консоль, я даже увижу, что два массива данных возвращены правильно … Я даже попытался вывести данные, чтобы убедиться, что они были правильными (никаких проблем):

console.log(JSON.stringify(columns_json))

Так что я не понимаю о jQuery:
Когда я обновляю переменные, которые я объявил в верхней части скриптов изнутри $.ajax почему массивы JSON недоступны на $('.table').footable( функционировать?

Признаюсь, что я играю с jQuery чуть больше месяца, так что для меня это все ново.

Я нашел один обходной путь, чтобы заставить это работать, и это было предложение по этому Сообщение. Я изменил свой скрипт и заставил его работать. Однако консоль бросает предупреждение:

«Синхронный XMLHttpRequest в основном потоке устарел, потому что
его пагубных последствий для конечного пользователя. «

Как всегда, любые мысли и предложения очень ценятся.

0

ajax footable jquery json php

Решение

По вопросам рекламы [email protected]

Accepted Answer

Переместите логику, которая заполняет вашу таблицу в обратном вызове успеха.

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

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

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

Предложение: также покажите анимацию загрузки / наложение, пока вы выполняете вызовы Ajax, которые могут занять несколько секунд.

После того, как вы изменили свой код, проверьте, должны ли ваши переменные быть глобальными.

var columns_json;
var rows_json;

jQuery(function($) {

$.ajax({
type: "POST",
dataType: "JSON",
url: "a.php",
data: {
action: 'test'
},

success: function(data) {
columns_json = data[0];
rows_json = data[1];

$('.table').footable({

"paging": {
"enabled": true
},

"filtering": {
"enabled": true
},

"sorting": {
"enabled": true
},

"columns": columns_json,

"rows": rows_json

});
},

failure: function(data) {
alert("Something went wrong");
}
});});

0

Другие решения

Других решений пока нет …

Источник