How to display server errors in templates using RESTAdapter?


#1

While trying to handle server side errors in Ember application, I am unable to show the errors in templates. On record.save action the API returns errors as:

{    
   "errors":[  
      {  
         "detail":"can't be blank",
         "source":{  
            "pointer": "/data/attributes/username"
         } }
      ]
}  

In template file, the code for showing errors for username attribute is:

 {{input type="text" value=username }}  
    {{#each model.errors.username as |error|}}  
         {{error.message}}  
    {{/each}}  
    {{input type="text" value=email }}  
  `  <button {{action 'register'}}>Register</button>`  

the action “register” tries saving the user as:

register: function(){  
    var username = this.controller.get('username');  
    var email = this.controller.get('email');  
    var user = this.store.createRecord('user',{  
            email: email,  
            username: username  
        });  
    user.save().then(function(){  
        //handle success  
     },function(error){  
       console.log(user.get('errors.username')); 
     });  
 }); 

In console I got the array[object] for errors.username where object contains the desired attribute and message, But in template I am not able to access these messages. I have posted this question on stackoverflow as well. http://stackoverflow.com/questions/40081844/server-side-errors-not-populated-in-ember-model-with-restadapter


#2

Hmm. It looks like you are creating the record… But you are not setting the model. You might need to do something like this.set(‘model’, user); ?

var user is contained within register function basically it doesn’t look like you are setting the model in the route. I’m not too sure but it’s something to think about.


#3

Thanks for the help. Directly setting the model didn’t give the results but I have done something like:

var route = this;
user.save().then(function(){  
        //handle success  
     },function(error){  
       var errors = user.get('errors');
       route.set('_model.errors',errors);
     });   

In model I have to return the _model _model:{}, model(){ return this.get(’_model’); }

But the question is why do we need to set the model manually? Shouldn’t the model update/ reset itself when it gets error in response from the API as it happens in case of successful creation/updation of records?


#4

There probably is a better, I don’t have the full picture to tell you lol. Maybe someone else can give some advice? mode()l is just a hook that feeds the controller the thing being returned, that’s one of the core responsibilities of route.

You can look into observes and notifypropertychange methods. Here is an example I found. Also, maybe you might need to rethink a different approach? I mean if it works, it works right? :stuck_out_tongue:


#5

I’m having the same problem. I’m using the RESTAdapter and I cannot for the life of me figure out how to handle server errors.


#6

Nevermind I got it work thanks to the blog post posted above.