CODEWITHSUNDEEP
backbone.jsjquery-callbackbackbone.js-collectionsbackbone-model
ashy143
ashy143

Reputation: 169

Backbone model which I see in success callback and error callback is different. #Backbone save

I have a backbone model which has Backbone Collections in it. When I save the model and if it is success then my model object is properly structured as it was. But when error occurs (say validation error), in error callback the model object is modified (Collections inside model object are converted into Array). As a result all my functions defined for that Collections are now "undefined" and gives me error.

    save : function() {
        this.model.save(_.extend(originalModel.toJSON() || {}, this.model
                .toJSON()), {
            success : this.onSaveSuccess,
            error: this.onSaveError,
            include : []
        });
    },

    onSaveSuccess : function(model) {
        //Here the model is properly structured
    },


    onSaveError : function(model, response) {
        // Here the model is modified, all collections are now array
        //I have to explicitly call my parse method to re structure it.
        model = model.parse(model.attributes);
    }

I would like to know why is this happening. Am I doing something wrong here ?

Upvotes: 0

Views: 191

Answers (2)

ashy143
ashy143

Reputation: 169

The solution for this is passing wait:true in options. This will not modify until and unless server returns a valid response.

save : function() {
    this.model.save(_.extend(originalModel.toJSON() || {}, this.model
            .toJSON()), {
        success : this.onSaveSuccess,
        error: this.onSaveError,
        **wait:true**
        include : []
    });
},

Upvotes: 0

Peter Wagener
Peter Wagener

Reputation: 2092

For the sake of this example, let's assume the attribute of the model that holds the collection is called "people". It isn't clearly documented, but model.save(attributes) actually behaves like:

model.set(attributes);
model.save();

Here's the relevant annotated source of save(...). What your code is doing is first setting the "people" attribute to the array of people, then attempting to save it. When the save fails, your model has the array, not the collection, as the value of "people".

I suspect your end point is returning the full representation of the model on success, and your model is correctly parsing that representation & re-building the Collection at that point. But your error handler won't do that automatically.

As an aside, in my experience Models that contain Collections are hard to manage & reason about. I've had better luck having a Model that contains an array of data, and then having a method on that Model to build a Collection on the fly. Something like:

var MyModel = Backbone.Model.extend({
    // ...

    getPeople: function() {
        // See if we've previously built this collection
        if (!this._peopleCollection) {
            var people = this.get('people');
            this._peopleCollection = new Backbone.Collection(people);
        }
        return this._peopleCollection;
    }
});

This removes the Collection concept from the server communication (where it's pretty unnecessary), while also providing a smarter data layer of your application (smart Models are a good thing).

Upvotes: 2

Related Questions