How to prevent tab key from causing tabbing to the tool bars in IE and Firefox

[Otis Mukinfus]

Sorry for the long title.

How does one prevent a tab key press from causing the focus to leave a page and
move to the navigation bar and tool bars in a browser?

I've set the TabIndex on all of the controls on the page, but as soon as I hit
the tab key the focus jumps to the nav control in IE or Firefox.

Thanks,
Good luck with your project,

Otis Mukinfus
http://www.arltex.com
http://www.tomchilders.com

 

[Laurent Bugnion [MVP]]

Hi,

Sorry for the long title.

How does one prevent a tab key press from causing the focus to leave a page and
move to the navigation bar and tool bars in a browser?

I've set the TabIndex on all of the controls on the page, but as soon as I hit
the tab key the focus jumps to the nav control in IE or Firefox.

Thanks,
Good luck with your project,

Otis Mukinfus

If the first and last "tab-enabled" objects on the page are controls
(and not links), you can use the following JavaScript (for example):

(first control on the page)

<input type="text" id="tfFirst" ... />

(last control on the page)
<input type="button"
onblur="document.getElementById('tfFirst').focus();" ... />

I looked for something similar for links, but I cannot find anything for
the moment. Though in theory links also support onblur and focus, I
can't seem to make it work in IE.

HTH,
Laurent

 

[Otis Mukinfus]

On Sun, 14 Jan 2007 16:44:56 +0100, "Laurent Bugnion [MVP]"

At bottom...

Hi,



If the first and last "tab-enabled" objects on the page are controls
(and not links), you can use the following JavaScript (for example):

(first control on the page)

<input type="text" id="tfFirst" ... />

(last control on the page)
<input type="button"
onblur="document.getElementById('tfFirst').focus();" ... />

I looked for something similar for links, but I cannot find anything for
the moment. Though in theory links also support onblur and focus, I
can't seem to make it work in IE.

HTH,
Laurent

Laurent,

I found the solution: Here is a sample:


CountryDropDownList.Attributes.Add("onkeydown", "if(event.which ||
event.keyCode)" +
"{if ((event.which == 9) || (event.keyCode == 9)) " +
"{document.getElementById('" + LatitudeTextBox.ClientID +
"').focus();return false;}} else {return true}; ");

LatitudeTextBox.Attributes.Add("onkeydown", "if(event.which ||
event.keyCode)" +
"{if ((event.which == 9) || (event.keyCode == 9)) " +
"{document.getElementById('" + LatitudeDropDownList.ClientID +
"').focus();return false;}} else {return true}; ");


What it amounts to is hijacking the tab keystroke.

Thanks for trying to help. I appreciate it!

Good luck with your project,

Otis Mukinfus
http://www.arltex.com
http://www.tomchilders.com