The results of the 2017 Ember Community Survey !

DS.Errors Class addon/-private/system/model/errors.js:15


Extends: Ember.Object

Uses: Ember.Enumerable

Uses: Ember.Evented

Defined in: addon/-private/system/model/errors.js:15

Module: ember-data

Holds validation errors for a given record, organized by attribute names.

Every DS.Model has an errors property that is an instance of DS.Errors. This can be used to display validation error messages returned from the server when a record.save() rejects.

For Example, if you had a User model that looked like this:

app/models/user.js
1
2
3
4
5
6
import DS from 'ember-data';

export default DS.Model.extend({
  username: DS.attr('string'),
  email: DS.attr('string')
});

And you attempted to save a record that did not validate on the backend:

1
2
3
4
5
let user = store.createRecord('user', {
  username: 'tomster',
  email: 'invalidEmail'
});
user.save();

Your backend would be expected to return an error response that described the problem, so that error messages can be generated on the app.

API responses will be translated into instances of DS.Errors differently, depending on the specific combination of adapter and serializer used. You may want to check the documentation or the source code of the libraries that you are using, to know how they expect errors to be communicated.

Errors can be displayed to the user by accessing their property name to get an array of all the error objects for that property. Each error object is a JavaScript object with two keys:

  • message A string containing the error message from the backend
  • attribute The name of the property associated with this error message
1
2
3
4
5
6
7
8
9
10
11
12
13
<label>Username: {{input value=username}} </label>
{{#each model.errors.username as |error|}}
  <div class="error">
    {{error.message}}
  </div>
{{/each}}

<label>Email: {{input value=email}} </label>
{{#each model.errors.email as |error|}}
  <div class="error">
    {{error.message}}
  </div>
{{/each}}

You can also access the special messages property on the error object to get an array of all the error strings.

1
2
3
4
5
{{#each model.errors.messages as |message|}}
  <div class="error">
    {{message}}
  </div>
{{/each}}
Show:

_add

private

Adds error messages to a given attribute without sending event.

_clear

private

Removes all error messages. to the record.

_findOrCreateMessages

private

_registerHandlers

private

Register with target handler

_remove

private

Removes all error messages from the given attribute without sending event.

add

(attribute, messages) deprecated

Adds error messages to a given attribute and sends becameInvalid event to the record.

Example:

1
2
3
if (!user.get('username') {
  user.get('errors').add('username', 'This field is required');
}

Parameters:

attribute String
messages (Array|String)

clear

deprecated

Removes all error messages and sends becameValid event to the record.

Example:

app/routes/user/edit.js
1
2
3
4
5
6
7
8
9
10
import Ember from 'ember';

export default Ember.Route.extend({
  actions: {
    retrySave: function(user) {
       user.get('errors').clear();
       user.save();
     }
  }
});

errorsFor

(attribute) Array

Returns errors for a given attribute

1
2
3
4
5
6
7
8
let user = store.createRecord('user', {
  username: 'tomster',
  email: 'invalidEmail'
});
user.save().catch(function(){
  user.get('errors').errorsFor('email'); // returns:
  // [{attribute: "email", message: "Doesn't look like a valid email."}]
});

Parameters:

attribute String

Returns:

Array

has

(attribute) Boolean

Checks if there is error messages for the given attribute.

app/routes/user/edit.js
1
2
3
4
5
6
7
8
9
10
11
12
import Ember from 'ember';

export default Ember.Route.extend({
  actions: {
    save: function(user) {
       if (user.get('errors').has('email')) {
         return alert('Please update your email before attempting to save.');
       }
       user.save();
     }
  }
});

Parameters:

attribute String

Returns:

Boolean
true if there some errors on given attribute

registerHandlers

(target, becameInvalid, becameValid) deprecated

Register with target handler

Parameters:

target Object
becameInvalid Function
becameValid Function

remove

(attribute) deprecated

Removes all error messages from the given attribute and sends becameValid event to the record if there no more errors left.

Example:

app/models/user.js
1
2
3
4
5
6
7
import DS from 'ember-data';

export default DS.Model.extend({
  email: DS.attr('string'),
  twoFactorAuth: DS.attr('boolean'),
  phone: DS.attr('string')
});
app/routes/user/edit.js
1
2
3
4
5
6
7
8
9
10
11
12
import Ember from 'ember';

export default Ember.Route.extend({
  actions: {
    save: function(user) {
       if (!user.get('twoFactorAuth')) {
         user.get('errors').remove('phone');
       }
       user.save();
     }
  }
});

Parameters:

attribute String

unknownProperty

private

Show:

content

{Array} private

errorsByAttributeName

{Ember.MapWithDefault} private

isEmpty

{Boolean}

length

{Number}

Total number of errors.

messages

{Array}

An array containing all of the error messages for this record. This is useful for displaying all errors to the user.

1
2
3
4
5
{{#each model.errors.messages as |message|}}
  <div class="error">
    {{message}}
  </div>
{{/each}}