backbone.js - Calling destroy on collection -

i doing sample application similar backbone-todo. when invoking destroy on collection it's giving error:

uncaught typeerror: cannot read property 'destroy' of undefined

how can solve problem. please suggest.

following method code:

$(function(){  var todo = backbone.model.extend({  defaults: function() {   return {     title: "empty todo...",     order: todos.nextorder(),     done: false   }; }  });   var todolist = backbone.collection.extend({    model : todo,    localstorage: new backbone.localstorage("todos-backbone"),    done: function() {     return this.where({done: true});   },    remaining: function() {     return this.without.apply(this, this.done());   },    nextorder: function() {     if (!this.length) return 1;     return this.last().get('order') + 1;   },    comparator: 'order'    });  var todoview = backbone.view.extend({    tagname:  "li",    template: _.template($('#item-template').html()),    events: {     "click a.destroy" : "clear"   },    initialize: function() {     this.listento(this.model, 'destroy', this.remove);   },    render: function() {     this.$el.html(this.template(this.model.tojson()));     return this;   },    clear: function(){     this.model.destroy();   } });  var appview = backbone.view.extend({    el: $("#todoapp"),    statstemplate: _.template($('#stats-template').html()),    events: {     "keypress #new-todo":  "createonenter",     "click #remove-all": "clearcompleted"   },    initialize: function() {     this.input = this.$("#new-todo");     this.main = $('#main');     this.footer = this.$('footer');      this.listento(todos, 'add', this.addone);     this.listento(todos, 'all', this.render);      todos.fetch();   },    render: function() {     var done = todos.done().length;     var remaining = todos.remaining().length;      if (todos.length) {       this.main.show();       this.footer.show();       this.footer.html(this.statstemplate({done: done, remaining: remaining}));     } else {       this.main.hide();       this.footer.hide();     }   },    createonenter: function(e){     if(e.keycode != 13) return;     if (!this.input.val()) return;     todos.create({       title: this.input.val()     })       this.input.val('');            },    addone: function(todo){     var view = new todoview({model: todo});     this.$("#todo-list").append(view.render().el);   },    clearcompleted: function(){     _.invoke(todos, 'destroy');     return false;   } 

});

for answer assume todos instance of todolist. assume error fired function in appview

clearcompleted: function(){   _.invoke(todos, 'destroy');   return false; } 

in there you're trying treat backbone.js collection instance is, collection eg list. backbone collections not lists, objects have property models list contains models. trying use underscore's invoke (which works on lists) on object bound cause errors.

but don't worry, backbone neatly implements many underscore methods model , collection, including invoke. means can invoke destroy each model in collection this

somecollection.invoke('destroy'); 

hope helps!