PDA

View Full Version : Do not let user focus on browser controls with TAB key navigation



aleksei.volchok
7 Sep 2011, 2:38 AM
FocusManager is turned off so user cycles through control elements with TAB key. User browsers are IE7 and IE8 so I don’t want him to get to browser controls after he presses TAB key while focusing on the last page control element (IE lets you browse through address box and toolbars with TAB ). I haven’t found easy way to stop this behavior so I’ve added invisible spans “firstElementOnPage” and “lastElementOnPage”. FirstElementOnPage is located before any content, it’s onFocus sends you to last real element on page, lastElementOnPage is located after all real content and sends you to first real element on page.

Things get complicated when you have dynamic page and you can’t just call first and last real element by id. On normal page you could get any control element by document.form[x].element[y], but ExtJS doesn’t use forms and it seems that I can use only document.all to search for focusable elements which takes too much time. I could also try to focus on firstElementOnPage and simulate TAB key press to get to next element – the first one of real content – but I’m not sure I can do this with JavaScript. I can also use Ext.query but it takes time and I can’t find enough info on syntax (how do I ask to look for button OR (tabindex != undefined AND tabindex != -1)?)

So the question is how can I get this behavior? Maybe there’s easy FocusManager config or is there a way to get first/last control element on page?