The dude abides

July 24th, 2012 § Comments Off on The dude abides § permalink

Man, when did forms get so complex? Oh, right, always.

Backbone.js is great because it lets me structure my app how I see best and gives me the tools to do so efficiently. Well, most of the tools. It’s not very good at dealing with handling multiple forms submitting over AJAX and orchestrating those submissions under a parent view. Nor should it be. However, I needed that functionality so I wrote some code.

I give you Abide

Abide is an extension of a Backbone.View that has hooks for checking model validation, dealing with multiple jQuery.Deferred promises (be they AJAX or not) and orchestrating the whole submission process in one place.

Just have your view extend Abide instead of Backbone.View…

var parentView,
    firstChild,
    secondChild,
    redhadedStepChild;

//Create up your parent view and extend Abide instead of Backbone.View
parentView = Backbone.Abide.extend({
    promises: function() {
        // Gather child view save promises
    }
}
});

//Create child views as well. These can be regular views or more Abide parents.
firstChild = Backbone.View.extend({ /* ... */ });
secondChild = Backbone.View.extend({ /* ... */ });
redhadedStepChild = Backbone.View.extend({ /* ... */ });

//Then instantiate the parent, passing in which views it should parent
new parentView({ views: [firstChild, secondChild, redhadedStepChild] });

…and override the promises method to return your view’s promises…

var sweetAbideView = Backbone.Abide.extend({
    promises: function() {
        var promises = [],
            self = this;

        _.each(self.views, function(view) {
            promises.push(view.model.save());
        });

        return promises;
    }
});

…and you’re good to go!

There’s more information on github. Fork and submit pull requests!