feat(md-input): add md-validate-success attribute

aurelia-ui-toolkits · Aug 27, 2016 · 1bb0a8e · 1bb0a8e
1 parent 56bea20
commit 1bb0a8e
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 4 deletions.
diff --git a/sample/src/samples/input/aurelia-validation.html b/sample/src/samples/input/aurelia-validation.html
@@ -10,6 +10,7 @@
     <md-input
       md-label="Last Name"
       md-placeholder="Last Name"
+      md-validate-success="good"
       md-value.bind="lastName & validate:rules">
     </md-input>
   </div>

diff --git a/sample/src/samples/input/aurelia-validation.js b/sample/src/samples/input/aurelia-validation.js
@@ -1,20 +1,20 @@
-import { inject } from 'aurelia-framework';
+import { inject, NewInstance } from 'aurelia-framework';
 import { ValidationController, validateTrigger } from 'aurelia-validation';
 import { ValidationRules } from 'aurelia-validatejs';
 
-@inject(ValidationController)
+@inject(NewInstance.of(ValidationController))
 export class AureliaValidation {
   firstName = '';
   lastName = 'Doe';
   myErrors = [];
 
   rules = ValidationRules
     .ensure('firstName').required()
-    .ensure('lastName').required();
+    .ensure('lastName').length({ minimum: 4 }).required();
 
   constructor(controller: ValidationController) {
     this.controller = controller;
-    this.controller.validateTrigger = validateTrigger.manual;
+    this.controller.validateTrigger = validateTrigger.change;
   }
 
   validateModel() {

diff --git a/src/input/input.js b/src/input/input.js
@@ -28,6 +28,7 @@ export class MdInput {
     defaultBindingMode: bindingMode.oneTime
   }) mdValidate = false;
   @bindable() mdValidateError;
+  @bindable() mdValidateSuccess;
   @bindable({
     defaultBindingMode: bindingMode.twoWay
   }) mdValue = '';
@@ -52,6 +53,9 @@ export class MdInput {
     if (this.mdValidateError)  {
       this.label.setAttribute('data-error', this.mdValidateError);
     }
+    if (this.mdValidateSuccess)  {
+      this.label.setAttribute('data-success', this.mdValidateSuccess);
+    }
     if (this.mdPlaceholder) {
       this.input.setAttribute('placeholder', this.mdPlaceholder);
     }