diff --git a/src/uiSelectDirective.js b/src/uiSelectDirective.js index e1e8e0a89..88ac0e852 100644 --- a/src/uiSelectDirective.js +++ b/src/uiSelectDirective.js @@ -101,9 +101,28 @@ uis.directive('uiSelect', attrs.$observe('disabled', function() { // No need to use $eval() (thanks to ng-disabled) since we already get a boolean instead of a string - $select.disabled = attrs.disabled !== undefined ? attrs.disabled : false; + $select.disabledFlag = attrs.disabled !== undefined ? attrs.disabled : false; + $select.disabled = $select.disabledFlag || $select.disabledSelector; }); + // When inside a disabled fieldset, disabledWatch element will be disabled + var disabledWatch = angular.element(""); + element.append(disabledWatch); + + // Watch the disabled flag on disabledWatch, and set $select.disabled. + scope.$watch( + function () { + if (disabledWatch.is) { + return disabledWatch.is(":disabled"); // use jquery if available + } + return !!element[0].querySelector('.ui-select-disable-watch:disabled'); + }, + function (value) { + $select.disabledSelector = value; + $select.disabled = $select.disabledFlag || $select.disabledSelector; + } + ); + attrs.$observe('resetSearchInput', function() { // $eval() is needed otherwise we get a string instead of a boolean var resetSearchInput = scope.$eval(attrs.resetSearchInput); diff --git a/test/select.spec.js b/test/select.spec.js index 15cfdb1d2..632444e49 100644 --- a/test/select.spec.js +++ b/test/select.spec.js @@ -657,6 +657,23 @@ describe('ui-select tests', function () { clickMatch(el3); expect(isDropdownOpened(el3)).toEqual(true); }); + + it('should be disabled when inside a disabled fieldset', function() { + var fieldset = angular.element("
"); + var e1 = createUiSelect({theme: 'select2'}); + var $select = e1.scope().$select; + + fieldset.append(e1); + expect($select.disabled).toEqual(false); + + fieldset.prop('disabled', true); + scope.$digest(); + expect($select.disabled).toEqual(true); + + fieldset.prop('disabled', false); + scope.$digest(); + expect($select.disabled).toEqual(false); + }); it('should allow decline tags when tagging function returns null', function () { scope.taggingFunc = function (name) { @@ -1950,6 +1967,23 @@ describe('ui-select tests', function () { expect(ctrl.items).toEqual([]); }); + it('should be disabled when inside a disabled fieldset', function() { + var fieldset = angular.element(""); + var e1 = createUiSelectMultiple({theme: 'select2'}); + var $select = e1.scope().$select; + + fieldset.append(e1); + expect($select.disabled).toEqual(false); + + fieldset.prop('disabled', true); + scope.$digest(); + expect($select.disabled).toEqual(true); + + fieldset.prop('disabled', false); + scope.$digest(); + expect($select.disabled).toEqual(false); + }); + it('should render initial state', function () { var el = createUiSelectMultiple(); expect(el).toHaveClass('ui-select-multiple');