diff options
author | isteven <isteven@server.fake> | 2014-07-09 15:21:41 +0800 |
---|---|---|
committer | isteven <isteven@server.fake> | 2014-07-09 15:21:41 +0800 |
commit | 95aa12694049b9b8ae0fb7429c68d69d4181673c (patch) | |
tree | c1acf45f415c9f46b2c71f810e138c6fa46150c1 | |
parent | 4d3c509c2b9b9784c10b26aecb6f599310337953 (diff) | |
download | angular-multi-select-95aa12694049b9b8ae0fb7429c68d69d4181673c.zip angular-multi-select-95aa12694049b9b8ae0fb7429c68d69d4181673c.tar.gz angular-multi-select-95aa12694049b9b8ae0fb7429c68d69d4181673c.tar.bz2 |
fixed click listener on single selection mode
-rw-r--r-- | angular-multi-select.css | 31 | ||||
-rw-r--r-- | angular-multi-select.js | 11 |
2 files changed, 8 insertions, 34 deletions
diff --git a/angular-multi-select.css b/angular-multi-select.css index 4c7eb5e..967af1c 100644 --- a/angular-multi-select.css +++ b/angular-multi-select.css @@ -18,22 +18,11 @@ min-width: 12px; } -/* ! create a "row" */ -.multiSelect .line { - height: 26px; - padding-bottom: 8px; -} - /* ! */ .multiSelect .inlineBlock { display: inline-block; } -/* -:focus { outline:none; } -::-moz-focus-inner {border:0;} -*/ - /* the multiselect button */ .multiSelect .button { display: block; @@ -117,6 +106,7 @@ color: #666; background-color: #f1f1f1; line-height: 1.6; + margin: 0px 0px 8px 0px; } /* clear button */ @@ -149,6 +139,7 @@ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ color: #888; + margin: 0px 0px 8px 0px; } /* helper elements on hover & focus */ @@ -257,24 +248,6 @@ cursor: pointer; } -/* Some visual aids on item labels -.multiSelect label input:focus ~ span::after, -.multiSelect label span:focus::after, -.multiSelect label span:hover::after { - /* Enable this if you want some arrow pointer on focus - content: ' \00AB'; -} -*/ - -/* Another visual aid - highlight during TAB / SHIFT+TAB keyboard operations -.multiSelect label input:focus ~ span { - color: #ff0000; - text-shadow: 1px 0px #ccc; - /* Enable this if you want some arrow pointer on focus - content: ' \00AB'; -} -*/ - /* checkboxes currently disabled */ .multiSelect .disabled, .multiSelect .disabled:hover, diff --git a/angular-multi-select.js b/angular-multi-select.js index 292bbab..62226f5 100644 --- a/angular-multi-select.js +++ b/angular-multi-select.js @@ -75,12 +75,12 @@ angular.module( 'multi-select', ['ng'] ).directive( 'multiSelect' , [ '$sce', '$ '<div class="checkboxLayer">' + '<form>' + '<div class="helperContainer" ng-if="displayHelper( \'filter\' ) || displayHelper( \'all\' ) || displayHelper( \'none\' ) || displayHelper( \'reset\' )">' + - '<div class="line" ng-if="displayHelper( \'all\' ) || displayHelper( \'none\' ) || displayHelper( \'reset\' )">' + + '<div ng-if="displayHelper( \'all\' ) || displayHelper( \'none\' ) || displayHelper( \'reset\' )">' + '<button type="button" ng-click="select( \'all\', $event );" class="helperButton" ng-if="!isDisabled && displayHelper( \'all\' )"> ✓ Select All</button> ' + '<button type="button" ng-click="select( \'none\', $event );" class="helperButton" ng-if="!isDisabled && displayHelper( \'none\' )"> × Select None</button> ' + '<button type="button" ng-click="select( \'reset\', $event );" class="helperButton" ng-if="!isDisabled && displayHelper( \'reset\' )" style="float:right">↶ Reset</button>' + '</div>' + - '<div class="line" style="position:relative" ng-if="displayHelper( \'filter\' )">' + + '<div style="position:relative" ng-if="displayHelper( \'filter\' )">' + '<input placeholder="Search..." type="text" ng-click="select( \'filter\', $event )" ng-model="inputLabel.labelFilter" ng-change="updateFilter();$scope.getFormElements();" class="inputFilter" />' + '<button type="button" class="clearButton" ng-click="inputLabel.labelFilter=\'\';updateFilter();prepareGrouping();prepareIndex();select( \'clear\', $event )">×</button> ' + '</div>' + @@ -552,6 +552,7 @@ angular.module( 'multi-select', ['ng'] ).directive( 'multiSelect' , [ '$sce', '$ // The idea below was taken from another multi-select directive - https://github.com/amitava82/angular-multiselect // His version is awesome if you need a more simple multi-select approach. + // close if ( angular.element( $scope.checkBoxLayer ).hasClass( 'show' )) { angular.element( $scope.checkBoxLayer ).removeClass( 'show' ); @@ -596,9 +597,9 @@ angular.module( 'multi-select', ['ng'] ).directive( 'multiSelect' , [ '$sce', '$ $scope.tabIndex = $scope.tabIndex + helperItemsLength - 2; } // if there's no filter then just focus on the first checkbox item - else { - $scope.formElements[ $scope.tabIndex ].focus(); - } + else { + $scope.formElements[ $scope.tabIndex ].focus(); + } // open callback $scope.onOpen( { data: element } ); |