Uncaught TypeError: Object [object Window] has no method 'each' function

Question

Hey guys here is my js file and I am taking error message about each function at line:24 and I do not know why I couldnt find whats wrong. I am just trying to see the list of items on the console.log panel but it does not even give me list on the html page.

(function() {

    window.App = {

        Models: {},
        Collections: {},
        Views: {}
    };

    window.template = function(id){
        return _.template( $('#' + id).html() );
    };

App.Models.Task = Backbone.Model.extend({});

App.Collections.Task = Backbone.Collection.extend({
    model: App.Models.Task
});

App.Views.Tasks = Backbone.View.extend({
    tagName: 'ul',

    render: function(){
        this.collection.each( this.addOne, this);

        return this;
    },

    addOne: function(task){
        //creating new child view
        var taskView = new App.Views.Task({ model: task });

        //append to the root element
        this.$el.append(taskView.render().el);
    }
});

App.Views.Task = Backbone.View.extend({
    tagName: 'li',

    template: template('taskTemplate'),

    events: {
        'click .edit': 'editTask'
    },

    editTask: function(){
        alert('you are editing the tas.');
    },

    render: function(){
        var template = this.template( this.model.toJSON() );
        this.$el.html(template);
        return this;
    }

});


var tasksCollection = new App.Views.Task([
{
    title: 'Go to the store',
    priority: 4
},
{
    title: 'Go to the mall',
    priority: 3
},
{
    title: 'get to work',
    priority: 5
}
]);

var tasksView = new App.Views.Tasks({ collection: tasksCollection });

$('.tasks').html(tasksView.render().el);

})();

did you include underscore in your js file? Can you check the console for what the this.collection is on that line. — Mike, Aug 15 '13 at 15:59
@JanDvorak i assume the only line in the code that uses `each` — user428517, Aug 15 '13 at 16:01
Where did you try a `console.log`? Please include that in your code and post the result. — Bergi, Aug 15 '13 at 16:08

mu is too short · Answer 1 · 2013-08-15T18:51:06.477

You're creating a view instance as though it was a class:

App.Views.Tasks = Backbone.View.extend({ /* ... */ });

var tasksCollection = new App.Views.Task([
{
    title: 'Go to the store',
    priority: 4
},
//...

and then you create another instance of that view and hand it tasksCollection as though it really was a collection:

var tasksView = new App.Views.Tasks({ collection: tasksCollection });

But views and collections are different things and only collection's have an each method (unless you add an each to your view of course).

You want to create tasksCollection as an App.Collections.Task:

var tasksCollection = new App.Collections.Task([
{
    title: 'Go to the store',
    priority: 4
},
//...

score 0 · Answer 2 · answered Feb 27 '14 at 05:45

0

Hi this is happening cus your each method not able to find the collection. As well the singular Task to Tasks

At this line: Change this

var tasksCollection = new App.Views.Task([

TO, this:

var tasksCollection = new App.Collections.Tasks([

answered Feb 27 '14 at 05:45

STEEL

8,955
9
67
89

Uncaught TypeError: Object [object Window] has no method 'each' function

2 Answers2