CODEWITHSUNDEEP
backbone.jscoffeescriptmarionette
Christopher
Christopher

Reputation: 345

MarionetteJS: Render only after fetch model success

How can I postpone rendering until a model is fetched in Marionette? I can listen to change event on the model, but then it will be rendered twice. Is there an elegant solution?

Manager.module 'Views', ( Views, App, Backbone, Marionette, $) ->
    class UserDetail extends Marionette.ItemView
        template: 'manager.users.detail'


        initialize: =>
            @model = new App.Models.ManagerUser( )
            return

        onBeforeRender: =>
            @username = 'test' # Comes from URL
            @model.fetch()
            return

        serializeData: ->
            data = @model.toJSON()
            return data

Upvotes: 4

Views: 2977

Answers (1)

Scott Puleo
Scott Puleo

Reputation: 3684

A common approach is to call fetch from your controller rather than the view. This allows you to avoid handling routing events in your views.

Here is a fiddle that demonstrates the technique.

http://jsfiddle.net/puleos/PHpCz/

Edit: (fiddle updated)

Mod.metaModel = new metaModel();
Mod.tagsCollection = new tagsCollection();

Mod.compositeView = new CompositeView({
    model: Mod.metaModel,
    collection: Mod.tagsCollection
});    

var metaPromise = Mod.metaModel.fetch({dataType: "jsonp"});
var tagsPromise = Mod.tagsCollection.fetch({dataType: "jsonp"});

metaPromise.done(function(data) {
    App.region.show(Mod.compositeView);
});

Upvotes: 4

Related Questions