2016-08-10 3 views
0

Ich arbeite derzeit mit einem Team an einer Ember-Anwendung, die Formvalidierungen benötigt. Wir haben uns entschieden, ember-cp-validations für die Front-End-Formularvalidierungen zu verwenden. Ich versuche, dem Beispiel zu folgen, dem sie einige einfache Validierungen hinzufügen müssen, aber aus irgendeinem Grund werden die Validierungsnachrichten nicht angezeigt. Ich habe eine separate Datei namens preprint-form-validator.js erstellt, die die grundlegenden Validierungen unter Verwendung von buildValidations enthält.Ember.js Formularvalidierungen mit ember-cp-Validierungen

Da ist in meinem Datenmodell, importierte ich die Datei:

import Validations from '../validators/preprint-form-validator';

und das Modell mit ihm verlängert, so dass das Modell, dass es wusste Validierungen für einige seiner Felder sein sollte:

export default DS.Model.extend(Validations, { ...

Nachdem ich das getan habe, folgte ich dem Beispiel und erstellte die validierte Eingabe-Komponente. Diese Dateien können here10 gefunden werden und sie erstellen das Front-End-Framework für wie die validierten Formulareingaben aussehen sollten.

schließlich in meiner Komponente enthalten ich die neue validierte-Eingabekomponente:

{{validated-input model=model valuePath="title" placeholder="Title"}}

Als ich mit dem Validator auf die Seite gehen, gibt es ein Eingabefeld, das nicht wirklich etwas zu tun hat - Wie in es nicht validiert oder überprüft die Einschränkungen, die ich versucht habe zu umfassen. In der Route, die die Komponente in ist, habe ich ein Modell Haken, der eine createRecord() wie dies tut:

import Ember from 'ember'; 

export default Ember.Route.extend({ 
    model() { 
     return this.store.createRecord('preprint'); 
    } 
}); 

Wenn ich das Problem zu lösen versuchte, ich glaube, es ist etwas, mit dem Modell oder das irgendwie das zu tun validation Eigenschaft wurde nicht in valided-input.js festgelegt.

Aber an diesem Punkt blieb ich stecken und konnte nicht herausfinden, was mit meiner Formularvalidierung falsch war.

Es scheint, als ob ich einige wichtige Verbindung in dieser Form Validierung fehlt, aber ich bin mir nicht sicher, was es ist. Ich würde mich freuen, wenn jemand eine Anleitung geben könnte, was ich falsch mache.

+0

In unserer Anwendung haben wir dies als Glättestation direkt und einfach zu verwenden. https://github.com/DockYard/ember-validations – sekhar

Antwort

0

Ich kann nicht sehen, nichts falsch mit Ihrem Code. Wie sieht Ihr "Preprint-Form-Validator" aus? Sie können eine Formularkomponente auch validieren, wenn Sie das möchten.

//login-form.js 
import { LoginValidations } from '../../validators/login-validator'; 

export default Ember.Component.extend(LoginValidations, { 
    isValid: Ember.computed.and('validations.isValid'), 
}); 

//login-form.hbs 

{{validated-input type="email" model=this valuePath="email"}} 
{{validated-input type="password" model=this valuePath="password"}} 

//validators/login-validator.js 
import { validator, buildValidations } from 'ember-cp-validations'; 

export const LoginValidations = buildValidations({ 
email: [ 
    validator('presence', { 
    presence: true, 
    message: 'O email deve ser informado' 
    }), 
validator('format', { 
    type: 'email', 
    message: 'Email inválido' 
}) 
], 

password: [ 
    validator('presence', { 
    presence: true, 
    message: 'A senha deve ser informada' 
    }), 
    validator('length', { 
    min: 6, 
    message: 'A senha deve possuir no mínimo 6 caracteres' 
    }),  
    validator('password-validator') 
] 
}); 

export default { LoginValidations };