TabIndex is not working in DynamicForm

[fairoz172]

Hi,

We are using SmartGWT Pro 3.0 version.

In one dynamic form I have 4 textboxes followed by two small icons for search and clear. Now whenever user enters anything in any of these 4 textboxes and click on tab, cursor should directly go to search icon. I gave tab index as 1 for all the 4 textboxes and tab index as 2 to search icon but this is not working.

Please provide your input on this.

Thanks.

[Isomorphic]

Just set canTabToIcons if you want to be able to tab to your icons - remove any attempt to manually set tabIndex.

[fairoz172]

Thanks for the reply, I didn't found this method in DynamicForm, can you mention the class name where this method is available.

[Isomorphic]

Sorry, this is an advanced setting on FormItem, and not documented.

However, it is not needed because the behavior you want is actually already the default. So you just need to remove your attempts to set tabIndex entirely.

[fairoz172]

If I remove then how it will work, my requirement is like this,
I have four text boxes textBoxA, textBoxB, textBoxC, textBoxD, searchIcon, clearIcon, now user typed something in textBoxB and pressed Tab key, focus should directly go to searchIcon.

[Isomorphic]

Oh, we thought you meant there was a searchIcon next to *every* field.

You don't want to have the Tab key jump ahead to the search icon and skip other fields. That would make your application unable to be used from the keyboard, so it would not comply with Section 508 accessibility guidelines. It would also be surprising to users.

You can of course use some other key to jump to the search icon - see for example Canvas.accessKey, which you could set on a Button widget.

[fairoz172]

I understand the usability point but this is the client requirement, do we have any way by which we can implement this functionality.

[Isomorphic]

No supported way since this isn't allowed in enterprise apps. But you can add a keyDown and keyPress handler, detect the tab key, and call canvas.focus() or DynamicForm.focusInItem() to programmatically move focus around.

[fairoz172]

Thanks for the input, I implemented it in different way, instead of moving the focus from text box to search icon, I am displaying search result when user type something in textbox and press enter.