Added tabindex support, fix #41

Author: lcdsantos

bower.json

@@ -1,7 +1,7 @@
 {
   "name": "jquery-selectric",
   "description": "Fast, simple and light jQuery plugin to customize HTML selects",
-  "version": "1.8.0",
+  "version": "1.8.1",
   "keywords": [
     "select",
     "selectbox",

dist/jquery.selectric.js

@@ -9,7 +9,7 @@
  *    /,'
  *   /'
  *
- * Selectric Ϟ v1.8.0 (2014-08-28) - http://lcdsantos.github.io/jQuery-Selectric/
+ * Selectric Ϟ v1.8.0 (2014-09-01) - http://lcdsantos.github.io/jQuery-Selectric/
  *
  * Copyright (c) 2014 Leonardo Santos; Dual licensed: MIT/GPL
  *
@@ -96,7 +96,8 @@
             finalWidth,
             optionsLength,
             eventTriggers,
-            isMobile = /android|ip(hone|od|ad)/i.test(navigator.userAgent);
+            isMobile = /android|ip(hone|od|ad)/i.test(navigator.userAgent),
+            tabindex = $original.prop('tabindex');
 
         function _init(opts) {
           _this.options = $.extend(true, {}, defaults, _this.options, opts);
@@ -204,7 +205,10 @@
               isOpen ? _close() : _open(e);
             });
 
-            $input.prop('disabled', false).off().on({
+            $input.prop({
+              tabindex: tabindex,
+              disabled: false
+            }).off().on({
               keypress: _handleSystemKeys,
               keydown: function(e){
                 _handleSystemKeys(e);
@@ -246,6 +250,8 @@
               }
             });
 
+            $original.prop('tabindex', false);
+
             // Remove styles from items box
             // Fix incorrect height when refreshed is triggered with fewer options
             $li = $('li', $items.removeAttr('style')).click(function(){
@@ -332,7 +338,7 @@
             $('.' + _this.classes.open).removeClass(_this.classes.open);
 
             isOpen = true;
-            itemsHeight = $items.outerHeight(),
+            itemsHeight = $items.outerHeight();
             itemsInnerHeight = $items.height();
 
             // Give dummy input focus
@@ -440,7 +446,7 @@
           if ( isEnabled ){
             $items.add($wrapper).add($input).remove();
             !preserveData && $original.removeData(pluginName).removeData('value');
-            $original.off(bindSufix).off(eventTriggers).unwrap().unwrap();
+            $original.prop('tabindex', tabindex).off(bindSufix).off(eventTriggers).unwrap().unwrap();
             isEnabled = false;
           }
         }

dist/jquery.selectric.min.js

@@ -1,6 +1,6 @@
 {
   "name": "jquery-selectric",
-  "version": "1.8.0",
+  "version": "1.8.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/lcdsantos/jQuery-Selectric.git"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "selectric",
-  "version": "1.8.0",
+  "version": "1.8.1",
   "title": "jQuery Selectric",
   "author": {
     "name": "Leonardo Santos",

selectric.jquery.json

@@ -0,0 +1,21 @@
+{
+  "node": true,
+  "browser": true,
+  "esnext": true,
+  "bitwise": true,
+  "camelcase": true,
+  "curly": true,
+  "eqeqeq": true,
+  "immed": true,
+  "indent": 2,
+  "newcap": true,
+  "noarg": true,
+  "quotmark": "single",
+  "undef": true,
+  "unused": "vars",
+  "strict": true,
+  "globals": {
+    "$": false,
+    "jQuery": false
+  }
+}

src/.jscsrc

@@ -79,7 +79,8 @@
             finalWidth,
             optionsLength,
             eventTriggers,
-            isMobile = /android|ip(hone|od|ad)/i.test(navigator.userAgent);
+            isMobile = /android|ip(hone|od|ad)/i.test(navigator.userAgent),
+            tabindex = $original.prop('tabindex');
 
         function _init(opts) {
           _this.options = $.extend(true, {}, defaults, _this.options, opts);
@@ -187,7 +188,10 @@
               isOpen ? _close() : _open(e);
             });
 
-            $input.prop('disabled', false).off().on({
+            $input.prop({
+              tabindex: tabindex,
+              disabled: false
+            }).off().on({
               keypress: _handleSystemKeys,
               keydown: function(e){
                 _handleSystemKeys(e);
@@ -229,6 +233,8 @@
               }
             });
 
+            $original.prop('tabindex', false);
+
             // Remove styles from items box
             // Fix incorrect height when refreshed is triggered with fewer options
             $li = $('li', $items.removeAttr('style')).click(function(){
@@ -315,7 +321,7 @@
             $('.' + _this.classes.open).removeClass(_this.classes.open);
 
             isOpen = true;
-            itemsHeight = $items.outerHeight(),
+            itemsHeight = $items.outerHeight();
             itemsInnerHeight = $items.height();
 
             // Give dummy input focus
@@ -423,7 +429,7 @@
           if ( isEnabled ){
             $items.add($wrapper).add($input).remove();
             !preserveData && $original.removeData(pluginName).removeData('value');
-            $original.off(bindSufix).off(eventTriggers).unwrap().unwrap();
+            $original.prop('tabindex', tabindex).off(bindSufix).off(eventTriggers).unwrap().unwrap();
             isEnabled = false;
           }
         }