Set tab index on input fields

I have four user input fields that I have created by putting a text element on the stage and then adding code like the following for each one on the Stage compositionReady:

//Set up Amount entry box

Amt.html("");

txtAmt = $('<input />').attr({'type':'text', 'value':'', 'id':'Amt'});

txtAmt .css ('font-size', 14);

txtAmt .css ('width', 100);

txtAmt .appendTo(Amt);

//Set up Term entry box

term.html("");

txtTerm = $('<input />').attr({'type':'text', 'value':'', 'id':'term'});

txtTerm .css ('font-size', 14);

txtTerm .css ('width', 100);

txtTerm .appendTo(term);

I have four input boxes set up like this, one above the other down the stage. They work just fine. The user can enter a number and I can pick it up programmatically;

The problem is that I need the user to be able to tab down through the input boxes in sequence.

But the tab stops seem to work backwards. They tab UP rather than DOWN. So if, for example, I am in the second of the four boxes and hit tab, the focus jumps to the box above, rather than the box below.

I tried going to the Accessibility section in the Properties of each text element and setting the Tab Index. That makes the tab move in the right direction, but I have to tab twice to move from one box to the next. (It seems like it is tabbing to the text element and then tabbing to the input box associated with that text element instead of just going to the input box.)

A lot of my users like tabbing around forms, so I really need to get this figured out. All suggestions gratefully accepted.

Thanks!

Carolyn