feat(md-checkbox): forward blur event

aurelia-ui-toolkits · Sep 5, 2016 · c5c451e · c5c451e
1 parent ddacfbd
commit c5c451e
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/src/checkbox/checkbox.html b/src/checkbox/checkbox.html
@@ -1,5 +1,5 @@
 <template>
-  <input type="checkbox" id="${controlId}" ref="checkbox" />
+  <input type="checkbox" id="${controlId}" ref="checkbox" blur.trigger="blur()" />
   <label for="${controlId}">
     <slot></slot>
   </label>

diff --git a/src/checkbox/checkbox.js b/src/checkbox/checkbox.js
@@ -1,4 +1,5 @@
 import { bindable, customElement } from 'aurelia-templating';
+import { DOM } from 'aurelia-pal';
 import { bindingMode } from 'aurelia-binding';
 import { inject } from 'aurelia-dependency-injection';
 import { AttributeManager } from '../common/attributeManager';
@@ -37,6 +38,11 @@ export class MdCheckbox {
     this.checkbox.addEventListener('change', this.handleChange);
   }
 
+  blur() {
+    const event = DOM.createCustomEvent('blur');
+    this.element.dispatchEvent(event);
+  }
+
   detached() {
     this.attributeManager.removeClasses(['filled-in', 'disabled']);
     this.checkbox.removeEventListener('change', this.handleChange);