GithubHelp home page GithubHelp logo

bvedad / ember-changeset-cp-validations Goto Github PK

View Code? Open in Web Editor NEW

This project forked from offirgolan/ember-changeset-cp-validations

0.0 1.0 0.0 250 KB

Ember CP Validations support for Ember Changeset

License: MIT License

JavaScript 84.57% HTML 11.59% Handlebars 3.83%

ember-changeset-cp-validations's Introduction

Ember Changeset CP Validations

Build Status npm version Code Climate Test Coverage Dependency Status

Ember CP Validations support for Ember Changeset

Requirements

Compatibility

  • Ember.js v3.16 or above
  • Ember CLI v2.13 or above
  • Node.js v10 or above

Installation

ember install ember-changeset-cp-validations

Helpful Links

Looking for help?

If it is a bug please open an issue on GitHub.

Usage

The Template Helper

<<<<<<< HEAD This addon updates the changeset helper by creating a changeset instance via the createChangeset.

{{dummy-form
    changeset=(changeset user)
    submit=(action "submit")
    rollback=(action "rollback")
}}

Passing a custom action as a second argument to the changeset helper is supported but make sure to call the passed validate method to run the necessary validations.

{{dummy-form
    changeset=(changeset user (action "customValidate"))
    submit=(action "submit")
    rollback=(action "rollback")
}}
import Ember from 'ember';

const { Component } = Ember;

export default Component.extend({
  actions: {
    customValidate({ key, newValue, oldValue, changes }, validate) {
      // do some custom stuff

      return validate(...arguments);
    }
  }
});

Creating a Changeset

There are 2 ways to create a changset programmatically.

Using createChangeset

createChangeset is a no fuss way of quickly creating a new changeset instance. It will return a new changeset instance that is setup for the passed model and its validations.

import Ember from 'ember';
import createChangeset from 'ember-changeset-cp-validations';

const { Component } = Ember;
=======
See the [Contributing](CONTRIBUTING.md) guide for details.

>>>>>>> 64ca393... v3.0.0...v3.24.0

export default Component.extend({
  init() {
    this._super(...arguments);

    let model = get(this, 'model');
    this.changeset = createChangeset(model);
  }
});

Using buildChangeset

buildChangeset allows you more freedom with creating the changeset instance. It will return a hash that includes the validateFn and validationMap required to support the validations for the passed model.

import Ember from 'ember';
import { buildChangeset } from 'ember-changeset-cp-validations';

const { Component } = Ember;

export default Component.extend({
  init() {
    this._super(...arguments);

    let model = get(this, 'model');
    let { validateFn, validationMap } = buildChangeset(model);
    this.changeset = new Changeset(model, validateFn, validationMap);
  }
});

Disable CP Validations Dependents

When changes get applied to the actual model, validations will be re-triggered since the dependents of the CPs have changed. As of ember-cp-validations v3.1.0, to disable this, you may put all or selective attribute CPs in a volatile state via the volatile option.

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,
        volatile: false
      })
    ]
  }
}, {
  volatile: true
});

ember-changeset-cp-validations's People

Contributors

dhaulagiri avatar ember-tomster avatar greenkeeperio-bot avatar lolmaus avatar offirgolan avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.