md-select Disabled

[mrkirchner]

Currently md-select has no way to be disabled from the handle bars helper.

[lukeclewlow]

Does anyone have a quick fix for this?

[lukeclewlow]

I updated md-select.hbs to

<label id="{{id}}" class="active">{{label}}</label>
{{view "select"
  id=id
  content=content
  optionValuePath=optionValuePath
  optionLabelPath=optionLabelPath
  prompt=prompt
  value=value
  classNameBindings="validate:validate errors:invalid:valid"
  disabled=disabled
}}

<small class="red-text">
  {{#if errors}}
    {{errors.firstObject}}
  {{else}}
    &nbsp;
  {{/if}}
</small>

and md-select.js

import Ember from 'ember';
import MaterializeInputField from './md-input-field';
import layout from '../templates/components/md-select';

export default MaterializeInputField.extend({
  layout,

  optionLabelPath: 'content',
  optionValuePath: 'content',
  disabled: null,

  didInsertElement() {
    this._super(...arguments);
    this._setupSelect();
  },

  _setupSelect() {
    // jscs: disable
    this.$('select').material_select();
    // jscs: enable
  },

  // TODO: clean up any listeners that $.select() puts in place
  // _teardownSelect() {
  //
  // }

  // TODO: this could be converted to a computed property, returning a string
  //  that is bound to the class attribute of the inputSelector
  errorsDidChange: Ember.observer('errors', function() {
    const inputSelector = this.$('input');
    // monitor the select's validity and copy the appropriate validation class to the materialize input element.
    if (!Ember.isNone(inputSelector)) {
      Ember.run.later(this, function() {
        const isValid = this.$('select').hasClass('valid');
        if (isValid) {
          inputSelector.removeClass('invalid');
          inputSelector.addClass('valid');
        } else {
          inputSelector.removeClass('valid');
          inputSelector.addClass('invalid');
        }
      }, 150);
    }
  })
});

This just gives you a disabled property to access from handlebar.

import Ember from 'ember';

export default Ember.Controller.extend({
    formDisabled: true
})

{{md-select content=content disabled=formDisabled }}