I have a Backbone collection

jQuery ->
  class App.Collections.List extends Backbone.Collection
    model: App.Models.ListItem

I am trying to initialize the collection on page load:

var list = new App.Collections.List;
list.reset(<%= @data.to_json.html_safe %>)

This throws a JS error in the backbone lib.

Uncaught TypeError: undefined is not a function application.js:597
f.extend._prepareModel application.js:597
f.extend.add application.js:591
f.extend.reset application.js:595
(anonymous function)

However, if i change the code to:

var list = new Backbone.Collections;
list.reset(<%= @data.to_json.html_safe %>)

The reset works, and the collection is populated -- thought the objects in the Collection don't appear to know that they should be ListItem objects. Do I have to do something special to all a reset of my custom Collection?

I have a Backbone collection

jQuery ->
  class App.Collections.List extends Backbone.Collection
    model: App.Models.ListItem

I am trying to initialize the collection on page load:

var list = new App.Collections.List;
list.reset(<%= @data.to_json.html_safe %>)

This throws a JS error in the backbone lib.

Uncaught TypeError: undefined is not a function application.js:597
f.extend._prepareModel application.js:597
f.extend.add application.js:591
f.extend.reset application.js:595
(anonymous function)

However, if i change the code to:

var list = new Backbone.Collections;
list.reset(<%= @data.to_json.html_safe %>)

The reset works, and the collection is populated -- thought the objects in the Collection don't appear to know that they should be ListItem objects. Do I have to do something special to all a reset of my custom Collection?

• javascript
• collections
• backbone.js

• Works for me, as far as I can reproduce your setup : jsfiddle/LXW6h – nikoshr Commented Jun 4, 2012 at 16:15
• The Model and Collection load order was incorrect. See Derick's answer below and my followup ment to hom. – empire29 Commented Jun 4, 2012 at 16:50

2 Answers 2

the _prepareModel stacktrace line gives a hint that you have your model declared after your collection.

You most likely have your code set up like this:

  class App.Collections.List extends Backbone.Collection
    model: App.Models.ListItem

  class App.Models.ListItem extends Backbone.Model

which is going to fail because ListItem is not yet declared when you try to use it in your collection's model attribute. You are essentially setting the model attribute to undefined.

You need to declare the model first:

  class App.Models.ListItem extends Backbone.Model

  class App.Collections.List extends Backbone.Collection
    model: App.Models.ListItem

Note that this is not a limitation in CoffeeScript or Backbone. This is a JavaScript behavior caused by the use of object literals. The value of an object literal key/value pair is evaluated immediately, which means it must exist or it will be returned as undefined or some other error thrown.

As Derick said you need to declare models first, for that purpose just I usually just change require order the App.coffee(main backbone file) to this

...
require_tree ./models
require_tree ./collections
...