Backbone : Uncaught TypeError: Cannot call method 'each' of undefined
In answer to http://stackoverflow.com/questions/22050347
by Jon Beebe
HTML
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://jashkenas.github.io/underscore/underscore-min.js"></script>
<script src="http://jashkenas.github.io/backbone/backbone-min.js"></script>
JavaScript
// JavaScript Document
(function(){
window.App = {
Models : {},
Collections : {},
Views : {}
};
//model
App.Models.Task = Backbone.Model.extend({});
//view
App.Views.Task = Backbone.View.extend({
tagName : 'li',
render : function(){
this.$el.html(this.model.get('title'));
return this;
}
});
//collection
App.Collections.Tasks = Backbone.Collection.extend({
model : App.Models.Task
});
//collection view
App.Views.Tasks = Backbone.View.extend({
tagName : 'ul',
initialize : function(){this.render();},
render : function(){
this.collection.each(function(t){
var v = new App.Views.Task({model : t});
this.$el.append(v.render().el);
}, this);
}
});
//begin play yard
var tasks = new App.Collections.Tasks([
{title : 'Go to Mall', priority : 4},
{title : 'Go Home', priority : 3},
{title : 'Go to Movie', priority : 2}
]);
var tasksView = new App.Views.Tasks({collection : tasks});
console.log(tasksView.el);
$('body').append(tasksView.el);
})();