CODEWITHSUNDEEP
javascriptbackbone.jsbackbone.js-collections
Pierre Cangem's
Pierre Cangem's

Reputation: 23

populate collection on Backbone

Tutorial.Views.Layout = Backbone.Layout.extend({
  model: Tutorial.Model,
  });

initialize: function () {
  _.bindAll(this);
  this.model = new Tutorial.Model({id : $("#data").data('user') });
  this.collection = new Tutorial.Collection();
  var success1 = function(){

         console.log('OK');

     };
     this.collection.fetch({success : success1});

},

showTuto: function(){

  step = this.collection.first(1);
  console.log(step);
},

My problem is my collection is empty. My model has 4 items, but i see none of them .

Thanks in advance

Upvotes: 0

Views: 282

Answers (1)

Evan
Evan

Reputation: 6115

We need to see some more code to make a closer suggestion, but hopefully this explanation will help you out. You should pass your model directly to the collection, OR deal with it in the fetch.

//simplified view
YourView = Backbone.View.extend({
    initialize : function(){
         var testModel = new Tutorial.Model({id : $("#data").data('user') });
         this.collection = new Tutorial.Collection();
         this.collection.add(testModel);
    }
});

In this case, you would be adding that model directly to your collection. If you want to asyncronously call and get data from the fetch and then pass a callback, you could do something like this:

//simplified view
    YourView = Backbone.View.extend({
        initialize : function(){
             this.collection = new Tutorial.Collection();
             this.collection.fetch(function(){
                  console.log('okay');
             });
        }
    });

    Tutorial.Collection = Backbone.Collection.extend({
        fetch : function(callback){
             // grab a ref to your collection
             var thisCollection = this;

             // call your data function which has the ajax call
             getYourDataFunction(function(data){
                  // if your data returned is an array of objects
                  thisCollection.add(data);

                  if (typeof callback === "function"){
                       //if you included a callback, call it with a reference to the collection
                       callback.call(thisCollection);
                  }
             });
        });
    });

Upvotes: 1

Related Questions