A 'url' property or function must be specified error in Backbone.js

Question

I am trying to make a small app to learn how Backbone works. I took example app from source called Todo. I have created my app from scratch using snippets from Todo app. I think these apps look very similar but for some reason I can't make work some things that work fine in the example app. I get an error:

A 'url' property or function must be specified

The other problem is that I can't make this code from the example work:

this.model.bind('change', this.render);

It says there is no such a function as bind. I checked all libraries versions and code and can't realize what I do wrong. What can I do about this?

Solution 1

The TODO example is relying on localStorage thus it does not define a url (as it is local). However, when you use the default Backbone.sync implementation, you need to define a url attribute on your collections and models (it can be either static or a function). Not doing so results in the error you got.

As for the this.model.bind, I guess you lost the reference to your model somehow. Two things: this is not what you think it is or this.model is not defined. Post more code to have complete answers.

Solution 2

The collection attempts to load a bunch of models from json output at the URL:

window.MyList = Backbone.Collection.extend({
  model: MyModel,
  url: 'someurl.json', // load a bunch of json objects into models.
});

If that URL points to a json output of your models, you're good to go.

You can also override the way a collection makes restful call back to your server to support legacy servers or a local storage adapter: http://documentcloud.github.com/backbone/#Sync