Backbone infinite loop when creating models

Question

I'm doing something pretty standard, I think.

Model:


app.model.Todo = Backbone.Model.extend({
    defaults: {
        task: ''
        , completed: 0
        , attachments: []
        , note: ''
    }
});

Collection:


var Todos = Backbone.Collection.extend({
    model: app.model.Todo

    , localStorage: new Store('Todos')

    , incomplete: function () {
        return this.filter(function (todo) {
            return !todo.get('completed')
        });
    }

    , complete: function () {
        return this.filter(function (todo) {
            return todo.get('completed')
        });
    }

    , comparator: function(todo) {
        return todo.get('order');
    }
});

app.collection.Todos = new Todos();

Then, if I just do:

app.collection.Todos.create({task: 'hi'});
app.collection.Todos.create({task: 'hi'});

The 2nd one never works. I get an infinite loop (too much recursion on Firefox and stack_overflow on Chrome).

I'm really at a loss. I commented out all events as well.

Appears it spins out of control here in backbone:

// Return a copy of the model's `attributes` object.
toJSON: function(options) {
    return _.clone(this.attributes);
},

UPDATE: If I add id: 0 or whatever id to the model the error stops, but if I give it a custom ID (i.e. new Date().getTime() the error happens again. It's like whenever I create a unique item it blows up.

UPDATE 2:

var todo = new gator.model.Todo({task: actionbarVal});
gator.collection.Todos.add(todo);
gator.collection.Todos.sync('create', todo);

Doing the above kinda works, and for what I need it for it works, but it's really bad. It's bad because every single time we do a new add and sync it calls toJSON 1 time for every time add and sync has been called on this page load. So, if you add 3 items, you get 6 toJSON calls (1 for the first, 2 for the second, 3 for the third). Also, it's not as clean. I also noticed in the toJSON call in backbone this.attributes with create was correct the first time. The 2nd time it was like this.attributes == backbone or something. Very, very strange. It had all the methods of Backbone. It was as if clone did a deep clone or something.

I'm afraid that I couldn't find `create` for **models** in [documentation](http://backbonejs.org/#Collection-create), its only there for **collections**. — Cyclone, Dec 18 '12 at 07:09
Seems to work okay if you call create on the collection: http://jsfiddle.net/ambiguous/8Szgv/ PS: if you have an array (or other mutable object) in your `defaults` then you should be using a defaults function rather than an object. — mu is too short, Dec 18 '12 at 07:17
@Cyclone damn, my fault. That was a type. I meant a collection. Fixed. — Oscar Godson, Dec 18 '12 at 07:36
@OscarGodson for future cleanliness of SO, can you please paste the solution as an answer to this, so that it doesn't look un-answered/resolved. :) — isNaN1247, Dec 18 '12 at 08:03
@muistooshort I dunno :( I've literally removed almost all my code and it's still happening. I took out the defaults. My collection just sets up up a model, localStorage and then `app.collections.Todos = new Todos()` and "app.js" just has app = `{model: {}, collection: {}, view: {}}` and `window.app = app`; — Oscar Godson, Dec 18 '12 at 08:03
What's different between what you're doing and what the fiddle is doing? Version issues perhaps? — mu is too short, Dec 18 '12 at 08:44
@muistooshort Maybe. I really don't know. I've spent hours on this. Instead of doing a "create" if I do a manual new model, then a collection add (model), then sync('create', model), then it works... Kinda. It calls toJSON above 1 time for every new create. So, If I do 3 creates without a refresh toJSON is called 3 times in a row. 4th one, 4 toJSON calls. Huh... — Oscar Godson, Dec 18 '12 at 08:49

score 2 · Answer 1 · answered Dec 18 '12 at 20:52

2

You have a mismatch between your version of Backbone (v0.9.9) and the version of the localstorage add-on. Be sure to get the latest version of the localstorage add-on from the Backbone repo and it will fix this problem.

answered Dec 18 '12 at 20:52

Derick Bailey

72,004
22
206
219

score 1 · Accepted Answer · answered Dec 22 '12 at 22:37

I eventually fixed it by reverting back to 0.9.2 of Backbone, thanks to Derick Bailey. My attempts of using the latest localStorage add-on didn't seem to fix it. Maybe I was using a different source? I was using develop of this:

https://github.com/jeromegn/Backbone.localStorage

Backbone infinite loop when creating models

2 Answers2