diff --git a/ionic/components/select/select.scss b/ionic/components/select/select.scss
index 62034fa479..6bcd50f912 100644
--- a/ionic/components/select/select.scss
+++ b/ionic/components/select/select.scss
@@ -20,4 +20,10 @@ ion-select {
.item-multiple-inputs ion-select {
position: relative;
+}
+
+.select-disabled,
+.item-select-disabled ion-label {
+ opacity: 0.4;
+ pointer-events: none;
}
\ No newline at end of file
diff --git a/ionic/components/select/select.ts b/ionic/components/select/select.ts
index c91df9f72c..5f7cbaefbc 100644
--- a/ionic/components/select/select.ts
+++ b/ionic/components/select/select.ts
@@ -101,7 +101,9 @@ import {Option} from '../option/option';
'
' +
- '',
@@ -127,7 +129,6 @@ export class Select {
@Input() okText: string = 'OK';
@Input() alertOptions: any = {};
@Input() checked: any = false;
- @Input() disabled: boolean = false;
@Output() change: EventEmitter = new EventEmitter();
@@ -161,10 +162,12 @@ export class Select {
*/
@HostListener('click', ['$event'])
private _click(ev) {
- console.debug('select, open alert');
ev.preventDefault();
ev.stopPropagation();
+ if (this._disabled) return;
+ console.debug('select, open alert');
+
// the user may have assigned some options specifically for the alert
let alertOptions = merge({}, this.alertOptions);
@@ -228,8 +231,10 @@ export class Select {
set value(val: any) {
// passed in value could be either an array, undefined or a string
- this._values = (Array.isArray(val) ? val : isBlank(val) ? [] : [val]);
- this.updateOptions();
+ if (this._disabled) {
+ this._values = (Array.isArray(val) ? val : isBlank(val) ? [] : [val]);
+ this.updateOptions();
+ }
}
get text() {
@@ -274,6 +279,16 @@ export class Select {
});
}
+ @Input()
+ get disabled() {
+ return this._disabled;
+ }
+
+ set disabled(val) {
+ this._disabled = isTrueProperty(val);
+ this._item && this._item.setCssClass('item-select-disabled', this._disabled);
+ }
+
/**
* @private
* Angular2 Forms API method called by the model (Control) on change to update
diff --git a/ionic/components/select/test/multiple-value/main.html b/ionic/components/select/test/multiple-value/main.html
index 3306f0295d..f2ffdcf7df 100644
--- a/ionic/components/select/test/multiple-value/main.html
+++ b/ionic/components/select/test/multiple-value/main.html
@@ -39,6 +39,13 @@
+
+ Disabled
+
+ Selected Text
+
+
+
toppings: {{toppings}}
carFeatures: {{carFeatures}}