diff --git a/src/uiSelectDirective.js b/src/uiSelectDirective.js index 76df08b67..6c54717e3 100644 --- a/src/uiSelectDirective.js +++ b/src/uiSelectDirective.js @@ -70,9 +70,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 d502040b4..be320b066 100644 --- a/test/select.spec.js +++ b/test/select.spec.js @@ -119,6 +119,8 @@ describe('ui-select tests', function() { ); } + + function getMatchLabel(el) { return $(el).find('.ui-select-match > span:first > span[ng-transclude]:not(.ng-hide)').text(); } @@ -374,6 +376,23 @@ describe('ui-select tests', function() { 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) { return null; @@ -1221,9 +1240,9 @@ describe('ui-select tests', function() { }); - describe('multi selection', function() { + function createUiSelectMultiple(attrs) { var attrsHtml = ''; if (attrs !== undefined) { @@ -1246,6 +1265,23 @@ describe('ui-select tests', function() { ); } + 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');