Does this deferred require a resolution of some sort

Question

I'm checking to see if a user is logged in before I prepare the page in a particular for members or guests. If they have the cookie, they're a member, if not they're a guest.

Have I done this properly?

function check_if_member(){

    var dfd = new $.Deferred();
    if (readCookie('isco')){
        //adds jquery data() element "user_information"
        //after making a jquery ajax post to retrieve it
        //and using a template to write data to the page
        //with the `success()` callback
        prepare_member('member');
    } else {
        //reveals some HTML on the page
        prepare_member('guest');
    }  
}

$(document).ready(function(){
    //before page loads, check if user is member
    $.when(check_if_member())
     .then(function(){
        console.log($('body').data('user_information'));
        return false; 
     });
});

I think I'm finally getting a bit of an understanding of deferred, but they still confuse me and I wonder if I've structured this appropriately, or if I need add a resolve or return line to any of my ajax requests or the line that saves the collected information to the jquery data(). Thank you.

EDIT

prepare_member function

function prepare_member(type) {

    if (type == 'member') {
        var user_information = readCookie('isco')

        $('body').data('user_information', user_information);

        var user_id = $('body').data('user_information').user_id;

        $.ajax({
            type: 'post',
            url: "/address.php",
            data: {
                type: "retrieve",
                user_id: user_id,
                isbilling: true
            },
            dataType: 'json',
            success: function (returnedData) {

                $('body').data('user_information').billing_information = returnedData['address_0'];

                //populate member billing fields
                $('#member_billing_container').append('<div>').children(':last')
                                                              .vkTemplate('/member_billing_template.tmpl', returnedData, function () {
                                                                  //some callback - possibly resolve promise
                                                              });
                //populate member contact fields
                $('#member_contact_container').append('<div>').children(':last')
                                                              .vkTemplate('/member_contact_template.tmpl', JSON.stringify(user_information), function () {
                                                                  //some callback - possibly resolve promise  
                                                               });
            }
        });

        $('.guest_container, .guest').hide();
        $('.member_container, .member').show();

    } else {

        $('.guest_container, .guest').show();
        $('.member_container, .member').hide();

    }

}

Answer 1

First, since we're talking about Deferreds, we won't use a success handler. $.ajax() returns a promise, so we can chain it into done() and keep using the deferred pattern.

Then, let's say you want to resolve your Deferred as soon as member data becomes available (this actually makes the answer much simpler, given that vkTemplate() does not return a promise and we would probably have to write a wrapper in order to keep the code readable).

The result would be something like:

function check_if_member()
{
    var dfd = $.Deferred(),           // Can be called without 'new'.
        cookie = readCookie("isco");  // Avoid reading cookie twice.
    prepare_member(cookie, dfd);
    return dfd.promise();             // Return promise.
}

function prepare_member(user_information, dfd) {
    if (user_information) {
        // Member mode.
        $("body").data("user-information", user_information);
        $.ajax({
            type: "post",
            url: "/address.php",
            data: {
                type: "retrieve",
                user_id: user_information.user_id,
                isbilling: true
            },
            dataType: "json"
        }).done(function(returnedData) {
            user_information.billing_information = returnedData["address_0"];
            dfd.resolve();  // Member data is available, resolve Deferred.
            $("#member_billing_container").append("<div>").children(":last")
                .vkTemplate("/member_billing_template.tmpl", returnedData,
                    function() {
                        // Maybe chain widgets or handlers...
                    });
            $("#member_contact_container").append("<div>").children(":last")
                .vkTemplate("/member_contact_template.tmpl",
                    JSON.stringify(user_information),
                    function () {
                        // Maybe chain widgets or handlers...
                    });
        });
        $(".guest_container, .guest").hide();
        $(".member_container, .member").show();

    } else {
        // Guest mode.
        dfd.resolve();  // No member data available, resolve Deferred
                        // (synchronously here). You might also want
                        // to reject() it instead.
        $(".guest_container, .guest").show();
        $(".member_container, .member").hide();
    }
}

$(document).ready(function() {
    $.when(check_if_member())
     .then(function() {
          console.log($("body").data("user-information"));
     });
});

Now, maybe you do not have to use the <body> element's data to convey the user information to your then() handler. Deferred objects can be resolved (or rejected, or notified) along with any information, for instance:

user_information.billing_information = returnedData["address_0"];
dfd.resolve(user_information);  // Member data is available, resolve Deferred
                                // and pass user information through promise.

Then you would only have to write:

$(document).ready(function() {
    $.when(check_if_member())
     .then(function(user_information) {
          console.log(user_information);  // Will be undefined in guest mode.
     });
});