Tabing focuses on disabled selectboxit in Firefox 30 and Chrome 35.0.1916.153

[rhessinger]

You can tab to a disabled selectboxit in Firefox 30 and Chrome 35.0.1916.153. Here is a plunker example.

http://plnkr.co/edit/2jVlOgV3ieBwpm5Fl349?p=info

---

Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

[rhessinger]

As an update. It looks like if i manually set the tabindex to '' from the .selectboxit-btn after calling disable (and setting it back on enable), then I don't have the tabbing problem. I updated the plunker for this.

http://plnkr.co/edit/2jVlOgV3ieBwpm5Fl349?p=info

[rhessinger]

For some reason the modifying the attributes within the disable function in the selectboxit code is not updating the DOM. If I create a plugin that extends selectboxit, it works fine. My plugin code is below.

// Plugin setup
  (function ($) {

    // Declaring a new jQueryUI Widget that extends SelectBoxIt
    $.widget('selectBox.newPlugin', $.selectBox.selectBoxIt, {
         // Overwriting the SelectBoxIt open method
        disable: function() {

          // Calling the default SelectBoxIt open method
          $.selectBox.selectBoxIt.prototype.disable.call(this);
          console.log(this.dropdown);
          //this.dropdown.attr('tabindex', '');
          this.dropdown.removeAttr('tabindex');

        }
      });

      // Then call your new plugin like this
      //var selectBox = $("select#test").newPlugin().data("newPlugin");

    }(jQuery));

[gfranko]

Are you still seeing this issue? It looks like it works in Firefox 31 and Chrome 36

[rhessinger]

Yes, I'm running 31 and my plunker still has the tabbing problem.

[devert]

I can confirm this is still happening in latest Chrome 39.0.2171.71. Ensuring tabindex is set to -1 on the .selectboxit span seems to fix the problem.