Отложено вообще не работает с асинхронным Ajax-запросом - PullRequest
0 голосов
/ 10 июня 2011

У меня есть несколько списков HTML, заполненных асинхронными запросами Ajax.Когда все эти запросы завершены (их много), мне нужно заполнить форму, выбрав элементы списка, которые соответствуют моей записи о клиенте.

Я пытаюсь использовать deferreds для выполнения этого, нофункция завершает работу задолго до заполнения списков.Есть идеи?

$.when(
    $.ajax({
        url: "get-status.php",
        async: true,
        dataType: 'json',
        success: function (j) {
            var options = ''; 
            $.each(j, function(key, value) { 
                options += '<option value="' + key + '">' + value + '</option>';
            });     
            $("select#status_id").html(options);                
        }
    }),
    $.ajax({
        url: "get-groups.php",
        async: true,
        dataType: 'json',
        success: function (j) {
            var options = ''; 
            $.each(j, function(key, value) { 
                options += '<option value="' + key + '">' + value + '</option>';
            });     
            $("select#group_id").html(options);             
        }
    })                      
).then(populateForm('form1',customer_id));  

Фактический код приложения:

<!-- Main function -->  
populateFormBoxSS = function(id){
    $.ajax({
        url: "get-json-fich_ss.php?id="+id,
        async: false,
        dataType: 'json',
        success: function (j) {         
            // Populate drop-downs              
            $.when(populateEstadosTest('box-estado_id')).then(populateFormGeneric(j, "box"));   
        }
    });         
}   
<!-- Generic Form Population -->
populateFormGeneric = function (j, target) {
    $.each(j, function(key, value) { 
        switch ($('#'+target+'-'+key).attr('type')) {
            case 'checkbox':
                if(value==1) {
                    $('#'+target+'-'+key).attr('checked', true);
                }
                break;                      
            default:
                $('#'+target+'-'+key).val(value);
                break;                  
        }                                           
    });     
    return function(){
        // Do nothing
    }
}
<!-- Dropdown list population -->   
populateEstadosTest = function(field){
    var dfd = new $.Deferred();     
    $.ajax({
        url: "get-json-esta.php",
        async: true,
        dataType: 'json',
        success: function (j) {
                var options = ''; 
                $.each(j, function(key, value) { 
                    options += '<option value="' + key + '">' + value + '</option>';
                });     
                $("select#"+field).html(options);
                // Resolve Deferred
                dfd.resolve();              
        }
    }); 
    return dfd.promise(); // Returns a promise              
}

1 Ответ

0 голосов
/ 10 июня 2011

Возвращает ли populateForm ('form1') функцию? Отложено. Тогда ожидается функция обратного вызова, например, вот так:

var populateForm = function (j, target) {
    return function() {
        $.each(j, function(key, value) { 
            switch ($('#'+target+'-'+key).attr('type')) {
                case 'checkbox':
                    if(value==1) {
                        $('#'+target+'-'+key).attr('checked', true);
                    }
                    break;                      
                default:
                    $('#'+target+'-'+key).val(value);
                    break;                  
            }                                           
        });
    }     
}

$.when(
    $.ajax({
        url: "get-status.php",
        async: true,
        dataType: 'json',
        success: function (j) {
            var options = ''; 
            $.each(j, function(key, value) { 
                options += '<option value="' + key + '">' + value + '</option>';
            });     
            $("select#status_id").html(options);                
        }
    }),
    $.ajax({
        url: "get-groups.php",
        async: true,
        dataType: 'json',
        success: function (j) {
            var options = ''; 
            $.each(j, function(key, value) { 
                options += '<option value="' + key + '">' + value + '</option>';
            });     
            $("select#group_id").html(options);             
        }
    })                      
).then(populateForm('form1',customer_id));
...