Ich füge Formularvalidierungen mit dem Plugin "ember-validations" hinzu. Ich kann Inline-Validierungen durchführen, aber ich muss die Schaltfläche basierend auf dem Validierungsstatus deaktivieren/aktivieren.Formular-Übermittlungsschaltfläche mit ember-Validierungsstatus deaktivieren/aktivieren
Component.js
export default Ember.Component.extend(EmberValidations, {
validations: {
'model.firstName': {
presence: true,
presence: { message: 'Please enter valid first name.' }
},
'model.lastName': {
presence: true,
presence: { message: 'Please enter valid last name.' }
},
'model.email': {
presence: true ,
presence: { message: 'Please enter valid email name.' }
},
'model.department': {
presence: true,
presence: { message: 'Please enter valid department name.' }
},
}
});
Template.hbs
<form class="form-horizontal" role="form">
<div class="form-group">
<label class="control-label col-sm-3" for="fname">First Name:</label>
<div class="col-sm-8">
{{validated-input type="text" placeholder="First Name" value=model.firstName errors=errors.model.firstName}}
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3" for="lname">Last Name:</label>
<div class="col-sm-8">
{{validated-input type="text" placeholder="Last Name" value=model.lastName errors=errors.model.lastName}}
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3" for="email">Email:</label>
<div class="col-sm-8">
{{validated-input type="email" placeholder="Email" value=model.email errors=errors.model.email}}
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3" for="department">Department:</label>
<div class="col-sm-8">
{{validated-input type="text" placeholder="Department" value=model.department errors=errors.model.department}}
</div>
</div>
{{#bs-button classNames="table-btn" action=(action "saveAction" model) buttonType="button" type="update"}}Save{{/bs-button}}
</form>
Screenshot
Wie kann ich den Validierungsstatus des Formularformulareingangs während der Verwendung von ember validations erhalten, so dass ich dieses Flag für die Schaltfläche zum Deaktivieren/Aktivieren verwenden kann?
Danke Pavol für die Antwort. Wir müssen die Validierung von component.js in das Modell verschieben. Sonst gibt es Fehler validate ist keine Funktion. Ich habe den Code so geändert und es hat funktioniert. –