Ember-form-validate NPM

ember-form-validate

A simple ember form validate addon, using light-validate-js (another repo of mine).
API details here

Get start

Installation

ember install ember-form-validate

Basic Usage

You can use provided components form-validate and form-validate-field to do some simple tasks.
HBS:

{{#form-validate as |form validate|}}
  <ul class="errors">
    {{#each form.fields as |field index|}}
      {{#if field.errorMessage}}
        <li>{{index}}: {{field.errorMessage}}</li>
      {{/if}}
    {{/each}}
  </ul>

  {{#form-validate-field value=required1 validators=validateRequired validatorGroup=form as |validate errorMsg|}}
    Required: {{input placeholder='Enter text ...' value=required1 focus-out=(action validate)}}
    {{input type='button' value='validate' click=(action validate)}} 
    {{errorMsg}}
  {{/form-validate-field}}

  {{#form-validate-field value=required2 validators=validateRequiredFunc validatorGroup=form as |validate errorMsg|}}
    Required2: {{input placeholder='Enter text ...' value=required2 focus-out=(action validate)}}
    {{input type='button' value='validate' click=(action validate)}} 
    {{errorMsg}}
  {{/form-validate-field}}

  {{#form-validate-field value=required3 validators=(validator 'Length' params=(hash excludeEdge=true) errorMessage='This field is required!') validatorGroup=form as |validate errorMsg|}}
    Required: {{input placeholder='Enter text ...' value=required3 focus-out=(action validate)}}
    {{errorMsg}}
  {{/form-validate-field}}

  {{#form-validate-field value=integer validators=validateInteger validatorGroup=form as |validate errorMsg|}}
    Integer: {{input placeholder='Enter integer ...' value=integer focus-out=(action validate)}} 
    {{errorMsg}}
  {{/form-validate-field}}

  {{input type='button' value='Group Validate' click=(action validate (action 'submitForm'))}}

{{/form-validate}}

Controller:

import Ember from 'ember';

export default Ember.Controller.extend({
  validator: Ember.inject.service(),
  // A group of validators
  validateRequired: Ember.computed('validator.validators', function() {
    return validateRequiredFunc();
  }),
  // Function by returning single/multiple validators
  validateRequiredFunc() {
    return [{
      validator: this.get('validator.validators').Length,
      parameters: [{
        min: 0,
        excludeEdge: true
      }],
      errorMessage: 'required'
    }];
  },
  // Single object as validator
  validateInteger: Ember.computed('validator.validators', function() {
    return {
      validator: this.get('validator.validators').Regular,
      parameters: [{
        regular: /^\d*$/
      }],
      errorMessage: 'Must be integer'
    };
  })
});

Or you can use provided validator service and form-validator mixin to power up your components and form validation. Check API details here.