Question

First of all, i’m doing a modular application where there is a Core, a module interface layer and the modules.

the module displays a certain data that requires the following fetched via ajax:

• getTemplate() – get the display template
• getData() – get the data to display
• getRandomStuff() – some other random stuff to plug into the display (like say ads, tips, and stuff)

Just now:

• i forgot that i cannot do one after the other since data from ajax don’t come “one after the other”.
• it feels “weird” if i do nested callbacks – something feels wrong doing it. what if i needed more items via ajax? more nesting? that doesn’t sound right.

nested callbacks:

getTemplate('template_name', function(template) {
    getData('data_name', function(data) {
        getRandomStuff('random_stuff', function(randomStuff) {

            //do everything here?

        });
    });
});

i know i have my ideas but is there a proper way to do this?

Answer 1

Take a look at jQuery deferred: http://api.jquery.com/category/deferred-object/