Objet jQuery Deferred, appel de fonctions en séquence

Question

Je ne sais pas comment utiliser l'objet Deferred de jQuery, et les exemples que j'ai vus ne m'aident pas. Ce que je veux faire, c'est 1.) obtenir un objet de calendrier via un appel ajax, 2.) remplir une partie de mon objet global (MYOBJ) avec les données de calendrier, puis 3.) remplir un élément de page avec les nouvelles données dans MYOBJ . Ces trois fonctions implémentent la logique, et je veux les appeler dans l'ordre:

function getCalendar(refDate, numDays) {
    return $.ajax({
        type: "POST",
        url: "services/Calendar.asmx/GetCalendar",
        data: '{ "refDate": "' + refDate + '", "numDays": "' + numDays + '" }',
        contentType: "application/json; charset=utf-8",
        dataType: "json"
    }).promise();
}


function loadCalendarData(response) {
    var calData = jQuery.parseJSON(response.d);
    MYOBJ.cal.dMin = calData.dMin;
    MYOBJ.cal.dMax = calData.dMax;
    MYOBJ.cal.dates = calData.dates; // array of date strings
}


function populateCalendar (x, y, z) {
    // use data from MYOBJ.cal here
}

Je n'arrive pas à comprendre comment faire attendre populateCalendar () jusqu'à ce que loadCalendarData () soit terminé. Ceci ...

$.when(getCalendar(myDate, 70))
 .then(loadCalendarData)
 .then(populateCalendar(a, b, c))
 .fail(alertCalendarError);

... est évidemment incorrect - ce n'est qu'une variante que j'ai jetée contre le mur parce que je ne comprends pas ce que je fais ... :)

MISE À JOUR: Comme GoldenNewby et Brian ONeil le soulignent correctement, je pourrais simplement coller mon appel à populateCalendar à la fin de loadCalendarData. Cela fonctionnera certainement. J'aurais aimé y penser pendant que je postais. Je suppose que mon objectif ultime était de trouver comment réaliser le séquençage. Dans ce cas, cependant, je ne peux penser à aucun scénario où loadCalendarData serait appelé sans un appel à populateCalendar directement après, donc cette solution a vraiment du sens. Merci.

Answer 1

Vous exécutez actuellement populateCalendar(a, b, c).Vous devez passer la référence de la fonction.Essayez ceci.

$.when(getCalendar(myDate, 70))
 .then(loadCalendarData)
 .then(function(){
     populateCalendar(a, b, c)
  })
 .fail(alertCalendarError);

Answer 2

Il semble que la seule méthode qui doit être appelée de manière différée soit loadCalendarData.

J'appellerais loadCalendarData à partir du rappel de succès de l'appel .ajax que vous effectuez et vous pouvez simplement appeler populateCalendar à la fin de loadCalendarData (comme déjà mentionné dans les commentaires).

cela ressemblerait à quelque chose comme ça ...

function getCalendar(refDate, numDays) {
    return $.ajax({
        type: "POST",
        url: "services/Calendar.asmx/GetCalendar",
        data: '{ "refDate": "' + refDate + '", "numDays": "' + numDays + '" }',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: loadCalendarData
    });
}


function loadCalendarData(response) {
    var calData = jQuery.parseJSON(response.d);
    MYOBJ.cal.dMin = calData.dMin;
    MYOBJ.cal.dMax = calData.dMax;
    MYOBJ.cal.dates = calData.dates; // array of date strings

    populateCalendar(a, b, c); //not called until MYOBJ is setup
}


function populateCalendar (x, y, z) {
    // use data from MYOBJ.cal here
}