CODEWITHSUNDEEP
javascriptbackbone.jsbackbone-events
underscore666
underscore666

Reputation: 1739

Render function not called when fetching collection

I have defined a view bind to a collection.

1) when I initialise the View, a fetch call on collection is performed.
2) If I look to the result of the get request it is ok
3) The I would like to trigger this change (in myCollection) for calling the render function but it does not work.

Here is part of my code:

define([
    "MyCollection",
    "!text/template"
], function (myCollection, myTemplate) {

    var myView = Backbone.View.extend({

        initialize: function ()
        {
            myCollection.bind('change', this.render); // why the render is not called when 
                                                      // I perform the fetch even if the data is correctly loaded? 

            myCollection.fetch(); // it works
        },

        render: function ()
        {
            // some code
            this.$el <-- undefined 
        }

    });

    return myView;
});

If I use

1)

   initialize: function ()
   {
       myCollection.bind('reset', this.render);  // this.$el <-- undefined in render call, Why?

        myCollection.fetch(); // it works
   }

2) 

myCollection.fetch({
    success: function () {
         that.render(); // <-- here the $el is defined and it works, Why myCollection.bind('reset', this.render); not?? 
         // it seems to me that when I use reset the render function is called before the this.$el is defined
    }
});

Upvotes: 0

Views: 514

Answers (2)

Edward M Smith
Edward M Smith

Reputation: 10627

Backbone triggers a "reset" event, not a change event on the successful completion of a fetch()

var myView = Backbone.View.extend({

    initialize: function ()
    {
        myCollection.bind('reset', this.render);
        myCollection.fetch(); // it works
    },

    render: function ()
    {
        // some code
    }

});

Upvotes: 1

Vincent Briglia
Vincent Briglia

Reputation: 3068

You have to listen to the reset event, not the change event.

so:

myCollection.bind('reset', this.render, this);

Upvotes: 1

Related Questions