Использование jQuery getJSON и запуск функции ПОСЛЕ обработки результатов ... должно работать ... но не работает - PullRequest
Новая
       8

Использование jQuery getJSON и запуск функции ПОСЛЕ обработки результатов ... должно работать ... но не работает

2 голосов
/ 20 февраля 2012

У меня есть ряд функций, которые заполняют ряд раскрывающихся списков.

Это страница данных о продукте, которая служит как для добавления нового элемента, так и для редактирования существующего.В последнем случае, когда все раскрывающиеся списки заполнены, он получает данные элемента из базы данных в виде строки JSON и выбирает соответствующие значения в выпадающих списках, используя $('#elem').val('value')

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

1.  function loadBrands() {
2.     $('#brand').empty().append('<option value="">Select...</option>').addClass('centreLoader');
3.     $.getJSON('/jsonData/brands.txt', function (data) {
4.         $.each(data, function (i, item) {
5.             $('#brand').append('<option value="' + data[i].label + '">' + data[i].brandName+ '</option>');
6.         });
7.         $('#brand').removeClass('centreLoader');
8.         loadSavedItem(); 
9.     });
10. };

Я добавил номера строк, чтобы объяснить просто (хотя вы все будете знать, что это делает!)

Строка 3 получает данные JSON из моего файла (это действительные данные, поскольку они заполняются нормально), затем строка 4 начинает циклически возвращать возвращаемые данные и заполнять выпадающий список.вызывает функцию loadSavedItem, которая выглядит примерно так: 

1.  function loadSavedItem(thisItemId) {
2.     $.getJSON('/jsonData/QUERY_DB_FOR_THIS_PRODUCT (thisItemId)', function (data) {
3.         $('#brand').val(data[0].brand);
4.     });
5.  };

Опять, довольно просто, строка 2 получает вывод JSON (который снова действителен, он отлично заполняет другие поля) и устанавливает значения полейв зависимости от обстоятельств (это, очевидно, сокращенная версия кода)

Проблема заключается в том, что loadSavedItem() вызывается слишком рано, до полного заполнения #brands, поэтому он не может установитьоцените правильно.Если я поставлю задержку, то это сработает.

НО ... Я думал, что после оператора $(each... jQuery ничего не должно произойти, пока не закончится $(each)?

Как я могу убедиться, что это так?

Ответы [ 3 ]

4 голосов
/ 20 февраля 2012

По моему опыту, $ (каждый) может зацикливаться во время работы остальной части скрипта, если это имеет смысл (по крайней мере, в Chrome).Может быть, это как-то связано с «оптимизацией».

Я решил эту проблему раньше, проверив data.length, установив счетчик, который увеличивается на единицу, и затем запустив код, если счетчик равен длине. 

function loadBrands() {
    $('#brand').empty().append('<option value="">Select...</option>').addClass('centreLoader');
    $.getJSON('/jsonData/brands.txt', function (data) {
        var dataNum = data.length;
        var counter = 1;
        $.each(data, function (i, item) {
            $('#brand').append('<option value="' + data[i].label + '">' + data[i].brandName+ '</option>');
            if (dataNum == counter) {
                $('#brand').removeClass('centreLoader');
                loadSavedItem(); 
            }
            counter ++;
        });
    });
}
0 голосов
/ 20 февраля 2012

Я полагаю, что ключ async установлен для jQuery.ajax(). http://api.jquery.com/jQuery.ajax/

0 голосов
/ 20 февраля 2012

Мое предложение было бы добавить метод loadSavedItem () в функцию Success, как показано ниже. Это должно решить проблему. 

$.ajax({   
   url: url,   
   dataType: 'json',   
   async: true,   
   data: myData,   
   success: function(data) {     // loadSavedItem();   } 
});

Надеюсь, это поможет !!

...