Reload invalid ember-data model

Question

This is very similar to this question Force reload of dirty/invalid model in Ember

I'm using ember.js with ember-data.

DEBUG: ------------------------------- ember.js?compile=false:3521
DEBUG: Ember      : 1.5.0 ember.js?compile=false:3521
DEBUG: Ember Data : 1.0.0-beta.7+canary.e3b896bc ember.js?compile=false:3521
DEBUG: Handlebars : 1.3.0 ember.js?compile=false:3521
DEBUG: jQuery     : 1.11.0 ember.js?compile=false:3521
DEBUG: -------------------------------

The server returns a 422 with errors response for validation errors, which gets added to model's errors and marked as invalid, then the error shows up on my template. This all works fine. However, after the model is marked invalid following an attempted save(), if I then linkTo another route let's say to /show/id to view that same model. The data store retrieves the invalid model with invalid values instead of getting a fresh valid model. I have tried doing a rollback() onFail like: group.save().then(onSuccess, onFail); and the rollback works, however it also clears the model errors and refreshes the template so the user never sees the validation errors. What I want is to show the validation errors and if a linkTo another route happens; From there the model with invalid state, should no longer be pulled from the data store, but rather pulled from the server again. The only way I can get a valid model currently is to reload the entire page.

I have also tried forcing a reload using the model hook in the router, but this seems to cause errors:

    Ricauth.GroupShowRoute = Ember.Route.extend({
    model: function(params) {
        var group = this.store.find('group', params.id);
        group.reload(); // doesn't work, causes error
        return group;
    },
    setupController: function(controller, group) {
        controller.set('model', group);
        controller.set('readOnly', true);
        controller.set('meta', Ember.copy(this.store.metadataFor("group")))
    }
});

This is not really a good way to do it anyway, since I'm essentially reloading the model every time ShowRoute is requested. I also tried to check group.isValid, however it's undefined at that point. Any ideas on how to get this reloaded and only when the model is invalid?

I found a reasonable solution to this using onFail and unloadRecord(). unloadRecord will remove the record from the datastore so the store will then retrieve from the server next time this record is queried. My update action

    actions: {
    update: function (group) {
        var self = this;
        var onSuccess = function(group) {
            console.info("save: "+group);
            self.transitionTo('group.show', group);
        };
        var onFail = function(error) {
            console.info("failed: "+error.message);
            group.unloadRecord();
        };
        if(group.get('currentState').stateName == 'root.loaded.updated.uncommitted') {
            group.save().then(onSuccess, onFail);
        }
        else {
            onSuccess(group);
        }
    }
}

So while the unload does remove the record from the datastore, it goes into a state 'root.deleted.saved'. From this state I can't seem to then save the record because of the way the ember data state manager works. At this point I'm just having a difficult time understanding why I can't make something so conceptually simple work. Does anyone else have enough experience with ember-data to know how this should be handled?

Jay Swain Jay Swain · Accepted Answer · 2015-01-15T13:32:13

Use the deactivate method on Ember.Route (http://emberjs.com/api/classes/Ember.Route.html#method_deactivate). There you can check to see if the model is invalid, then rollback the record.

deactivate: function(){
  if(!this.model().get("isValid")){
    this.model().rollback();
  }
}

Reload invalid ember-data model

1 Answers