How to display server errors in templates using RESTAdapter?

Ember CLI
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.

1 Like
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.