Parse.js Binding error

Question

I'm new to Backbone.js and Parse so apologies if I'm not specific enough.

I've got a view that throws a TypeError upon initialisation that even if I fix by deleting the line in question, just throws up another error in code that is otherwise perfectly acceptable.

Here is the error I get:

Uncaught TypeError: Cannot call method 'bind' of undefined views.js:59
Uncaught TypeError: Cannot call method 'bind' of undefined views.js:59

Here is the view's init function, lines 59 and 60:

initialize: function() {
    this.model.bind("reset", this.render, this);
    this.model.bind("add", this.appendNewJob, this);
}

Please let me know in the comments if you need more code to go on. UPDATE: as requested, my render and appendNewJob functions:

render: function(eventName) {
    _.each(this.model.models, function(job){
        this.appendNewJob(job);
    }, this);
    this.delegateEvents();
    return this.el;
},
appendNewJob: function(job){
    this.$el.append(new JobListItemView({
        model: job
    }).render());
}

My router:

var AppRouter = Parse.Router.extend({
    initialize: function() {
        $('#header').html(new HeaderView().render());
    },
    routes: {
        "": "list",
        "jobs": "list",
        "settings": "viewSettings"
    },
    list: function() {
        var self = this;
        FB.getLoginStatus(function(response){
            if(response.status === 'connected') {
                // logged in.
                self.before(function() {
                    self.showView('#content', new JobListView());
                });
            } else if(response.status === 'not_authorized') {
                // not authorized.
            } else {
                // not connected.
                $('#app').hide();
                self.before(function() {
                    self.showView('#login', new StartView());
                });
            }
        });
    },
    viewSettings: function() {
        var self = this;
        FB.getLoginStatus(function(response){
            if(response.status === 'connected') {
                // logged in.
                self.before(function() {
                    self.showView('#content', new SettingsView());
                });
            } else if(response.status === 'not_authorized') {
                // not authorized.
            } else {
                // not connected.
                $('#app').hide();
                self.before(function() {
                    self.showView('#login', new StartView());
                });
            }
        });
        $('#filterBar').hide();
    },
    showView: function(selector, view) {
        if(this.currentView) this.currentView.close();
        $(selector).html(view.render());
        this.currentView = view;
        return view;
    },
    before: function(callback) {
        if(this.jobList) {
            if(callback) callback.call(this);
        } else {
            this.jobList = new JobCollection();
            var self= this;
            this.jobList.fetch({
                success: function() {
                    var joblist = new JobListView({
                        model: self.jobList
                    }).render();
                    $('#content').html(joblist);
                    if(callback) callback.call(self);
                }
            });
        }
    }
});

UPDATE: I am also using the parse js library in place of backbone.

Can you paste the code where you initialize the view.. probably your router — Amulya Khare
– Amulya Khare, Commented Dec 12, 2012 at 12:00
I've just modified the question as I forgot to add that I am using the Parse library rather than backbone.js. — liquidus219
– liquidus219, Commented Dec 12, 2012 at 12:10

jevakallio · Accepted Answer · 2012-12-12 12:11:38Z

1

You are initializing your view without passing in the model option. The error is a standard javascript error, which tells you that on line 59 this.model is undefined:

this.model.bind("reset", this.render, this);

The view cannot have a this.model property, unless you give the model to the view!

So instead of:

new JobListView();

You need to initialize it with

new JobListView({model: <insert your model here>});

answered Dec 12, 2012 at 12:11

jevakallio

36k4 gold badges109 silver badges114 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Parse.js Binding error

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related