diff --git a/addon/components/selectable-item.js b/addon/components/selectable-item.js index 3fbe61bc..ec3434b4 100644 --- a/addon/components/selectable-item.js +++ b/addon/components/selectable-item.js @@ -28,6 +28,10 @@ export default Component.extend(ChildComponentSupport, { group.setValueSelection(this.get('value'), val); } this.sendAction('action', { checked: !!val }); + + // Because the click() event is fired twice (on checkboxes at least), need to reset this var to its default + // so the click action can be fired again on the next click + this.set('clickActionWasSent', false); return !!val; } }), @@ -46,6 +50,25 @@ export default Component.extend(ChildComponentSupport, { this._setupLabel(); }, + onClick: null, + // For some reason, click is called twice, requiring a variable to avoid sending the action twice + clickActionWasSent: false, + + click() { + this._super(...arguments); + let clickAction = this.get('onClick'); + let isSelected = !this.get('isSelected'); + + if (!this.get('clickActionWasSent')) { + if (typeof clickAction === 'function') { + clickAction(isSelected); + } else if (typeof clickAction === 'string') { + this.sendAction('onClick', isSelected); + } + this.set('clickActionWasSent', true); + } + }, + group: computed(function() { return this.nearestWithProperty('__materializeSelectableItemGroup'); }) diff --git a/tests/dummy/app/controllers/forms.js b/tests/dummy/app/controllers/forms.js index 1e55a7dd..887ebe3c 100644 --- a/tests/dummy/app/controllers/forms.js +++ b/tests/dummy/app/controllers/forms.js @@ -65,6 +65,7 @@ export default Controller.extend({ checkValueTwo: true, checkboxIsSelected: false, + checkboxWithActionIsSelected: false, radioIsSelected: false, radioSelection: 2, otherRadioSelection: 'green', @@ -108,5 +109,12 @@ export default Controller.extend({ switchesSelectionsString: asJSON('switchesSelections'), checkboxChoicesString: asJSON('checkboxChoices'), - checkboxSelectionsString: asJSON('checkboxSelections') + checkboxSelectionsString: asJSON('checkboxSelections'), + + actions: { + checkboxClickAction(isChecked) { + let stateText = isChecked === true ? `Yes, of course.` : `Nope, hombre.`; + window.alert(`Are you checked? ` + stateText); + } + } }); \ No newline at end of file diff --git a/tests/dummy/app/templates/forms.hbs b/tests/dummy/app/templates/forms.hbs index 17955b6b..29c54c13 100644 --- a/tests/dummy/app/templates/forms.hbs +++ b/tests/dummy/app/templates/forms.hbs @@ -110,6 +110,8 @@ {{/options-panel}}