Skip to content

Commit 2ce9d1c

Browse files
chocobidouchocobidou
committed
Add the function of tabindex with plain use of other button like Enter
1 parent 8911d26 commit 2ce9d1c

6 files changed

Lines changed: 98 additions & 6 deletions

File tree

‎doc/index.htm‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
<script src="highlight/highlight.pack.js"></script>
3131
<script src="js/libs/angular.min.js"></script>
3232
<script src="js/libs/angular-route.min.js"></script>
33-
<script src="js/libs/isteven-multi-select.js"></script>
33+
<script src="js/libs/isteven-multi-select.js"></script>
3434
<script src="js/libs/paypal-button.min.js"></script>
3535

3636
<script src="js/app.js"></script>
@@ -41,7 +41,8 @@
4141
<script src="js/controllers/demo-disabling-enabling.js"></script>
4242
<script src="js/controllers/demo-grouping.js"></script>
4343
<script src="js/controllers/demo-callbacks.js"></script>
44-
<script src="js/controllers/demo-single-selection-mode.js"></script>
44+
<script src="js/controllers/demo-single-selection-mode.js"></script>
45+
<script src="js/controllers/demo-tabindex.js"></script>
4546

4647
<script>
4748
$("#menu-toggle").click(function(e) {
@@ -99,7 +100,10 @@ <h5>AngularJs MultiSelect &nbsp;&nbsp;<span class="fa fa-home"></span></h5>
99100
</li>
100101
<li class="subMenu">
101102
<a href="#/demo-single-selection-mode">Single Selection Mode</a>
102-
</li>
103+
</li>
104+
<li class="subMenu">
105+
<a href="#/tab-index">Tabindex</a>
106+
</li>
103107
<li>
104108
<a href="#/breaking-changes">Breaking Changes</a>
105109
</li>

‎doc/js/app.js‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,12 @@ var myApp = angular.module( 'myApp' , [
2222
$routeProvider.when( '/demo-minimum' , {
2323
templateUrl: 'views/demo-minimum.htm',
2424
controller: 'demoMinimum'
25-
});
25+
});
26+
27+
$routeProvider.when( '/tab-index' , {
28+
templateUrl: 'views/demo-tabindex.htm',
29+
controller: 'demoTabindex'
30+
});
2631

2732
$routeProvider.when( '/demo-horizontal-layout' , {
2833
templateUrl: 'views/demo-horizontal-layout.htm',
@@ -92,6 +97,8 @@ var myApp = angular.module( 'myApp' , [
9297
$routeProvider.when( '/other-cool-stuffs' , {
9398
templateUrl: 'views/other-cool-stuffs.htm'
9499
});
100+
101+
95102

96103

97104
$routeProvider.otherwise( {

‎doc/js/controllers/demo-tabindex.js‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
myApp.controller( 'demoTabindex' , [ '$scope' , function ($scope) {
2+
3+
$scope.modernBrowsers = [
4+
{
5+
icon: '<img src="https://cdn1.iconfinder.com/data/icons/fatcow/32/opera.png" />',
6+
name: 'Opera',
7+
maker: 'Opera Software',
8+
ticked: true
9+
},
10+
{
11+
icon: '<img src="https://cdn1.iconfinder.com/data/icons/fatcow/32/internet_explorer.png" />',
12+
name: 'Internet Explorer',
13+
maker: 'Microsoft',
14+
ticked: false
15+
},
16+
{
17+
icon: '<img src="https://cdn1.iconfinder.com/data/icons/humano2/32x32/apps/firefox-icon.png" />',
18+
name: 'Firefox',
19+
maker: 'Mozilla Foundation',
20+
ticked: true
21+
},
22+
{
23+
icon: '<img src="https://cdn1.iconfinder.com/data/icons/fatcow/32x32/safari_browser.png" />',
24+
name: 'Safari',
25+
maker: 'Apple',
26+
ticked: false
27+
},
28+
{
29+
icon: '<img src="https://cdn1.iconfinder.com/data/icons/google_jfk_icons_by_carlosjj/32/chrome.png" />',
30+
name: 'Chrome',
31+
maker: 'Google',
32+
ticked: true
33+
}
34+
];
35+
}]);

‎doc/js/libs/isteven-multi-select.js‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@ angular.module( 'isteven-multi-select', ['ng'] ).directive( 'istevenMultiSelect'
4646

4747
// settings based on attribute
4848
isDisabled : '=',
49+
tabindexglob : '=',
4950

5051
// callbacks
5152
onClear : '&',
@@ -895,6 +896,7 @@ angular.module( 'isteven-multi-select', ['ng'] ).directive( 'istevenMultiSelect'
895896
$scope.groupProperty = attrs.groupProperty;
896897
$scope.tickProperty = attrs.tickProperty;
897898
$scope.directiveId = attrs.directiveId;
899+
$scope.tabIndexGlob = attrs.tabindexglob;
898900

899901
// Unfortunately I need to add these grouping properties into the input model
900902
var tempStr = genRandomString( 5 );
@@ -966,8 +968,8 @@ angular.module( 'isteven-multi-select', ['ng'] ).directive( 'istevenMultiSelect'
966968
$scope.icon.tickMark = $sce.trustAsHtml( $scope.icon.tickMark );
967969

968970
// min length of keyword to trigger the filter function
969-
if ( typeof attrs.MinSearchLength !== 'undefined' && parseInt( attrs.MinSearchLength ) > 0 ) {
970-
vMinSearchLength = Math.floor( parseInt( attrs.MinSearchLength ) );
971+
if ( typeof attrs.minSearchLength !== 'undefined' && parseInt( attrs.minSearchLength ) > 0 ) {
972+
vMinSearchLength = Math.floor( parseInt( attrs.minSearchLength ) );
971973
}
972974

973975
/*******************************************************
@@ -1035,6 +1037,7 @@ angular.module( 'isteven-multi-select', ['ng'] ).directive( 'istevenMultiSelect'
10351037
'ng-click="toggleCheckboxes( $event ); refreshSelectedItems(); refreshButton(); prepareGrouping; prepareIndex();"' +
10361038
'ng-bind-html="varButtonLabel"' +
10371039
'ng-disabled="disable-button"' +
1040+
'tabindex="{{tabIndexGlob}}"' +
10381041
'>' +
10391042
'</button>' +
10401043
// overlay layer

‎doc/views/demo-tabindex.htm‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
<div class="row">
2+
<div class="col-sm-12">
3+
4+
<h3 class="pageHeading">Demo > tabindex</h3>
5+
6+
<p>
7+
Permit to use the tabindex attribute on the isteven-multi-select.
8+
</p>
9+
10+
<br />
11+
12+
<input type="text" tabindex="1"></input>
13+
<br />
14+
<br />
15+
16+
<div
17+
isteven-multi-select
18+
input-model="modernBrowsers"
19+
output-model="outputBrowsers"
20+
button-label="icon name"
21+
item-label="icon name maker"
22+
tick-property="ticked"
23+
tabIndexGlob="2"
24+
>
25+
</div>
26+
<br />
27+
28+
<input type="text" tabindex="3"></div>
29+
30+
31+
</div>
32+
</div>
33+
34+
<script>
35+
$(document).ready(function() {
36+
$('pre code').each(function(i, block) {
37+
hljs.highlightBlock(block);
38+
});
39+
});
40+
</script>

‎isteven-multi-select.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@ angular.module( 'isteven-multi-select', ['ng'] ).directive( 'istevenMultiSelect'
4646

4747
// settings based on attribute
4848
isDisabled : '=',
49+
tabindexglob : '=',
4950

5051
// callbacks
5152
onClear : '&',
@@ -895,6 +896,7 @@ angular.module( 'isteven-multi-select', ['ng'] ).directive( 'istevenMultiSelect'
895896
$scope.groupProperty = attrs.groupProperty;
896897
$scope.tickProperty = attrs.tickProperty;
897898
$scope.directiveId = attrs.directiveId;
899+
$scope.tabIndexGlob = attrs.tabindexglob;
898900

899901
// Unfortunately I need to add these grouping properties into the input model
900902
var tempStr = genRandomString( 5 );
@@ -1035,6 +1037,7 @@ angular.module( 'isteven-multi-select', ['ng'] ).directive( 'istevenMultiSelect'
10351037
'ng-click="toggleCheckboxes( $event ); refreshSelectedItems(); refreshButton(); prepareGrouping; prepareIndex();"' +
10361038
'ng-bind-html="varButtonLabel"' +
10371039
'ng-disabled="disable-button"' +
1040+
'tabindex="{{tabIndexGlob}}"' +
10381041
'>' +
10391042
'</button>' +
10401043
// overlay layer

0 commit comments

Comments
 (0)