Javascript arrêter après appel AJAX

Question

Le titre de la question est assez vague, mais voici ma situation. J'ai à peu près plus de 700 lignes de jQuery pour une application Web, chaque fonction et « point d'intérêt majeur » dans le code noté par un journal à la console quand il se déclenche. Par exemple, j'ai quelques fonctions qui utilisent un appel AJAX à un servlet pour récupérer des informations. Je me connecte lorsque la demande d'AJAX commence, si elle est réussi (puis imprimer les données qu'il a rassemblé), etc. Ainsi, par le regard de ce que ma console est connecté quand j'ouvre la page, il semble arrêter après le premier appel d'AJAX. Certes, l'appel semblait fonctionner très bien, et les données qu'il est revenu était parfait. Comme vous le verrez, il a même rempli la boîte de sélection comme prévu. Cependant, les journaux de la console arrêtent peu après, me faisant croire que, pour une raison quelconque, les autres fonctions ne sont pas appelés ...

jQuery

$(document).ready(function() {
    Initialize();
});
function Initialize() {
    console.log("Initializing...");
    User();
    Widgets();
    if($.cookie("fogbugzId") != null) {
        console.log("Stored ID: " + $.cookie("fogbugzId"));
        $("#userSelect").val($.cookie("fogbugzId")).trigger("change");
        $("#userSelect").hide();
    } else console.log("No ID Stored!");
}
function User() {
    console.log("Initializing User...");
    $.each(FetchUsers(), function(index, user) {
        $("#userSelect").append($("<option>").val(user.id).text(user.name));
    });
    $("#userSelect").change(function() {
        if($("#userSelect").val() != "") {
            console.log("User Changed to " + $("#userSelect").val() + ": " + $("#userSelect").text());
            $.cookie("fogbugzId", $("#userSelect").val(), { expires: 365 });
        }
        Update();
    });
    console.log("User Initialized!");
}
function FetchUsers() {
    console.log("Loading Users...");
    $("#loading").show();
    $.get(servlet, { command: "getUsers" }, function(data) {
        var users = new Array();
        $(data).find("user").each(function() {
            users.push({
                id: $(this).find("id").text(),
                name: $(this).find("name").text()
            });
        });
        $.each(users, function(index, user) {
            console.log(">> " + user.id + ": " + user.name);
        });
        console.log("Users Loaded!");
        return(users);
    }, "xml").complete(function() {
        $("#loading").hide();
    }).error(function() {
        console.log("Loading Users Failed!");
    });
}
function Widgets() {
    console.log("Initializing Widgets...");
    // More Code
    console.log("Widgets Initialized!");
}

Console

Initializing...
Initializing User...
Loading Users...
>> 267: Alex Molthan
>> 35: Bill Brinkoetter
>> 100: Bob Yoder
>> 189: Brian Cutler
>> 559: Brian Ormond
>> 400: Corey Nakamura
Users Loaded!

Mais l'exploitation forestière s'arrête là. Ainsi, l'appel AJAX pour récupérer les utilisateurs de la base de données fonctionne très bien, mais apparemment la fonction User() ne parvient pas à terminer correctement. La seule erreur que la console JavaScript me donne est un dans mon fichier jquery.min.js:

Uncaught TypeError: Cannot read property 'length' of undefined  jquery.min.js:16
    f.e.extend.each                                             jquery.min.js:16
    User                                                        modifytime.js:14
    Initialize                                                  modifytime.js:3
    (anonymous function)                                        modifyTime.jsp:21
    f.extend._Deferred.e.resolveWith                            jquery.min.js:16
    f.e.extend.ready                                            jquery.min.js:16
    f.c.addEventListener.B                                      jquery.min.js:16

Il semble que si elle se brise sur la $.each() qui itère à travers le réseau d'utilisateurs renvoyés par la fonction FetchUsers(). Je sais que le retour de la fonction réseau utilisable, donc je ne suis pas sûr de ce qu'il est coincé sur. Quelqu'un peut-il voir quelque chose que je me manque dès le départ? J'ai essayé attribuer le users[] retourné par la fonction FetchUsers() dans une variable d'abord, puis en passant que dans le $.each(), mais il n'a toujours pas. Toutes les suggestions?

Modifier : Après avoir remplacé la version minified de jQuery avec la version non compressée, il semble que le tableau d'utilisateurs que je passe dans la fonction $.each() a maintenant la propriété .length, ce qui est pourquoi il est rupture. Juste pour vérifier, avant d'appeler cette fonction particulière de $.each(), j'ai placé un journal de la users[].length renvoyée par la fonction de FetchUsers() voir qu'il avait encore pas de propriété .length. Je suis ensuite allé à la fonction FetchUsers() lui-même et placé un journal de la users[].length juste avant le retourner. Ce journal, cependant, fonctionne parfaitement bien (bien que mon exemple ne le montre pas, elle renvoie 40 utilisateurs). Alors, est mon users[] pas retourné comme un tableau ou quelque chose?

Answer 1

FetchUsers ne retourne rien, il n'a même pas une déclaration de retour. De plus, $ .get est une fonction asynchrone, de sorte que vous ne pouvez pas retourner la valeur passe à son rappel de la fonction FetchUsers. Au lieu de cela, vous pouvez faire FetchUsers prendre un rappel appelle quand il a reçu des données d'un utilisateur (et dans ce cas faire que le changement serait relativement trivial):

function User() {
    console.log("Initializing User...");
    FetchUsers(function(user) { // Changed!
        $("#userSelect").append($("<option>").val(user.id).text(user.name));
    });
    <...>
}

function FetchUsers(callback) { // Changed!
    console.log("Loading Users...");
    $("#loading").show();
    $.get(servlet, { command: "getUsers" }, function(data) {
        //var users = new Array(); No longer necessary.
        $(data).find("user").each(function() {
            callback({ // Changed!
                id: $(this).find("id").text(),
                name: $(this).find("name").text()
            });
        });
        <...>
}

La modification de ces trois lignes avec le « CHAINE! » commentaire devrait être suffisant pour le faire fonctionner correctement. (Bien que votre exploitation forestière des utilisateurs acquis devra être légèrement modifiée car ils ne sont plus poussés dans un tableau.)

Answer 2

Je vous avoue que je n'ai pas lu et compris toutes les parties de votre source (ni vérifié si toutes les accolades sont fermés), mais FetchUsers clairement ne retourne rien (contrairement à votre demande) - donc un appel à FetchUsers () Equivaut à 'indéfini'. La fixation, il faudra une ré-écriture comme Javascript, vous ne pouvez pas revenir vraiment un résultat de l'opération asynchrone (comme $ .get) d'une fonction synchrone (comme FetchUsers ()) -. Cela nécessiterait multithreading (une sorte de blocage, en attente, etc.)