RESOLVED: javascript: multi-box phone .focus issues
I have a form called CustInfo. In this form I have 3 text boxes (phone_1, phone_2, and phone_3). I figured out how after the first 3 digits (area code) I can automatically move to the next text box (phone_2). The issue is if I do a Shift-Tab it doesn't stay. Anyone know how to set it so it stays?
Here is some of my page info below.
phone_1 html tag is:
Code:
<input name="phone_1" type="text" onKeyUp="fnMoveNext(this, 'phone_2', 3, event);" size="3" maxlength="3">
phone_2 html tag is:
Code:
<input name="phone_2" type="text" onKeyUp="fnMoveNext(this, 'phone_3', 3, event);" size="3" maxlength="3">
phone_3 html tag is:
Code:
<input name="phone_3" type="text" size="3" maxlength="3">
javascript function is:
Code:
function fnMoveNext(obj, name, iMax, evt){
var vItemLen = obj.value.length;
var charCode = (evt.which) ? evt.which : event.keyCode
if (vItemLen == iMax) {
if (charCode != 16){
eval("document.CustInfo." + name + ".focus()");
}
}
}
Re: javascript: multi-box phone .focus issues
I'm not really following you. Shift tab moves backward to the previous tab item. To control the order that the tab key moves through the fields, use the tabindex attribute.
E.g set the tab index of phone_1 to 0, phone_2 to 1 and phone_3 to 2.
Re: javascript: multi-box phone .focus issues
The reason it is not staying is because it's a keyup event. Well, Shift-Tab is also a keyevent so it also calls this function and right after it goes back a tab, it goes forward making it look like it's not moving at all.
I thought 9 and 16 charCode would work if not doing a .focus() but it didn't work.
Any other suggestions?
Thanks in advance.
Re: javascript: multi-box phone .focus issues
Have a look at this page:
http://www.w3.org/2002/09/tests/keys.html?
You'll see that the shift tab combination is produced by both a key down and key up event. I would advise changing your code to use the key press instead of the keyup event. The shift key does not get registered in this event and all you need to do ignore the tab key (ASCII number 9).
Re: javascript: multi-box phone .focus issues
Here is what ended up working for me. I kept the call in the onKeyUp because onKeyPress did work but would put the 3rd number in the next textbox which I didn't want happening.
Code:
function fnMoveNext(obj, name, iMax, evt){
var vItemLen = obj.value.length;
var charCode = (evt.which) ? evt.which : event.keyCode
if (vItemLen == iMax){
if (charCode != 9 && charCode != 16){
eval("document.CustInfo." + name + ".focus()");
}
}
}
Thanks for all your help!