Ember CP Validations

Create an Account

These form inputs are bound to the User model which is created in the route's model hook. Each one of these fields has validations to make sure we we receive the data we want.

About Me

We have a secondary model, User Details, which holds extra information about our user. This model is part of the User model via a belongsTo relationship.

On submit, a manual validation is run which will validate both the User and User Details models. If both are valid, then the user can continue to the next screen.

import Model, { attr, belongsTo } from '@ember-data/model';
import { validator, buildValidations } from 'ember-cp-validations';

const Validations = buildValidations(
  {
    username: {
      description: 'Username',
      validators: [
        validator('presence', true),
        validator('length', {
          min: 5,
          max: 15,
        }),
      ],
    },
    password: {
      description: 'Password',
      validators: [
        validator('presence', true),
        validator('length', {
          min: 4,
          max: 10,
        }),
        validator('format', {
          regex: /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{4,10}$/,
          message:
            '{description} must include at least one upper case letter, one lower case letter, and a number',
        }),
        validator('length', {
          isWarning: true,
          min: 6,
          message: 'What kind of weak password is that?',
        }),
      ],
    },
    email: {
      validators: [
        validator('presence', true),
        validator('format', {
          type: 'email',
        }),
      ],
    },
    emailConfirmation: validator('confirmation', {
      on: 'email',
      message: 'Email addresses do not match',
    }),
    details: validator('belongs-to'),
  },
  {
    debounce: 500,
  }
);

export default Model.extend(Validations, {
  username: attr('string'),
  password: attr('string'),
  email: attr('string'),
  details: belongsTo('user-detail'),
});