Backbone.js collection.on(“add”) not working

Question

I'm trying to build a simple resume app. I'm trying to fire off the add event when adding an array of models to the collection. The event should simply log in the console that something happened. Unfortunately nothing seems to be happening. Also no error is being logged. Could someone give me a tip?

Here is the event handler:

$(document).ready(function(){
    //INITIALIZATION
    var resumeSectionCollection = new ResumeSectionCollection();
    var resumeSectionView = new ResumeSectionView();


    //setting up collection and adding data to it
    resumeSectionCollection.on("add", this.logme,this);
    resumeSectionCollection.add([careerObjectiveModel,workExperienceModel1,workExperienceModel2,workExperienceModel3,educationModel,softwareSkillsModel]);

});

Here is the collection class:

var ResumeSectionCollection = Backbone.Collection.extend({
    model: ResumeSectionModel,  
    logme: function(model){
        console.log("in logme");    
    },
});

Answer 1

In your $(document).ready callback function:

$(document).ready(function(){
    //...
    resumeSectionCollection.on("add", this.logme,this);
    //...
});

this will, in most cases, be window so you're actually saying:

resumeSectionCollection.on("add", window.logme, window);

But you don't have a logme function in window , your logme function is inside your ResumeSectionCollection collection. You probably want something more like this:

var ResumeSectionCollection = Backbone.Collection.extend({
    model: ResumeSectionModel,  
    initialize: function() {
        this.on('add', this.logme, this);
        // or
        // this.listenTo(this, 'add', this.logme)
    },
    logme: function(model) {
        console.log("in logme");    
    }
});

and then:

$(document).ready(function() {
    var resumeSectionCollection = new ResumeSectionCollection();
    var resumeSectionView = new ResumeSectionView();

    resumeSectionCollection.add([ careerObjectiveModel, workExperienceModel1, workExperienceModel2, workExperienceModel3, educationModel, softwareSkillsModel ]);
});