Parse.js Binding error - parsing

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.

Answer 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>});