Search code examples
ember.jsember-dataember-enginesember-cp-validations

Issue with ember-cp-validation in an ember-engines


As the title say, I have an issue with ember-cp-validations which I think is related to ember-engines.
Basically, my issue is that there is no validations in a form for a model that use ember-cp-validations. Here is my model:

import Ember from 'ember';
import DS from 'ember-data';
import { validator , buildValidations } from 'ember-cp-validations';

const Validations = buildValidations(
    {
        name:[
            validator('presence', true),
            validator('ds-error'),
            validator('length', {
                min: 3,
                max: 15,
                message: 'The length must be between 3-15 character'
            })
        ]
);

export default DS.Model.extend(Validations, {
    numericId: Ember.computed('id', function ()
    {
        "use strict";
        return Number(this.get('id'));
    }),
    name: DS.attr('string'),
});

As you can see, my model is quite simple, and it work perfectly fine in my application.

For the templates, I am using ember-bootstrap, and it look like that:

{{#bs-form formLayout="horizontal" model=myModel onSubmit=(action 'update') as |form|}}
  <fieldset>
    <legend>Configuration</legend>
        {{form.element controlType="text" label=Name
                       placeholder=myName
                       property="name"}}
        {{bs-button
            defaultText=Submit
            type="primary"
            disabled=(v-get myModel 'isInvalid')
            buttonType="submit"}}
  </fieldset>
{{/bs-form}}

My template is very simple too, you can see that in the first part of my form I am calling the property="name", which is where I am defining the anme property of my model.
The message doesn't show up if my name.length is less than 3 characters for example.
I am in the obligation of adding disabled=(v-get myModel 'isInvalid'), which will disabled my button if there the validation are not fulfilled, because if I didn't added this property, the information will be sent even if some information where false.
Maybe somebody has a tip to make the validation work in my form. Good day to all of you!


Solution

  • I just found it, there is an addon that will automatically show the message error, and validate it, in an ember-bootstrap form : ember-bootstrap-cp-validations