Select controls do not get focus when navigating with tab key

[GoogleCodeExporter]

What steps will reproduce the problem?
1. Create form elements with input type text and select, using plug-in
2. Press tab to move from input type text to select list

What is the expected output? What do you see instead?
Expecting select list to gain focus and allow navigation through select list 
items using up/down arrow keys. Instead, select list does not appear to gain 
focus.

What version of the product are you using? On what operating system?
0.1.3. PC Windows 7 IE9 and FF12.

Please provide any additional information below.
Any work arounds available? I have a heap of input elements in my form and love 
this plug in but require keyboard navigation.

Thanks in advance

Original issue reported on code.google.com by phec...@gmail.com on 4 Jun 2012 at 3:58

[GoogleCodeExporter]

Line 104 to 108:

sbHolder = $("<div>", {
    "id": "sbHolder_" + inst.uid,
    "class": inst.settings.classHolder,
    "tabindex": $target.attr("tabindex")
});

A tabindex attribute is added to the div.

Line 269 to 286:

case 9: //Tab
  if (trgt) {
    var inst = self._getInst(trgt);
    if (inst/* && inst.isOpen*/) {
      if ($f.length > 0) {
        self._changeSelectbox(trgt, $f.attr("rel"), $f.text());
      }
      self._closeSelectbox(trgt);
    }
  }
  var i = parseInt($this.attr("tabindex"), 10);
  if (!e.shiftKey) {
    i++;
  } else {
    i--;
  }
  $("*[tabindex='" + i + "']").focus();
  break;

Here the tabindex is looked up and jQuery forces the next element with an 
incremental tabindex to be focused.

I don't fully understand this. The next form element or sbHolder element should 
be the element focused on.

Original comment by adamso...@gmail.com on 23 Sep 2012 at 6:20

[GoogleCodeExporter]

I removed:
  var i = parseInt($this.attr("tabindex"), 10);
  if (!e.shiftKey) {
    i++;
  } else {
    i--;
  }
  $("*[tabindex='" + i + "']").focus();

and added this instead:

var focusables = $("input:focusable, .sbHolder");
var index = focusables.index(this);
var current = !e.shiftKey ? index+1 : index-1;
next = focusables.eq(current).length ? focusables.eq(current) : 
focusables.eq(0);
next.focus();

It works fine except that focus is not triggered when the SHIFT -- TAB keys are 
hit together.

Original comment by adamso...@gmail.com on 23 Sep 2012 at 8:03

Attachments:

• selectbox-patch