Important Notice - Forums is archived
To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
Browser dependant keyboard handling
Hi,
I stumbled upon a little difference in the keyboard handling. I have a NativeSelect connected as follows:
reportTypeNS = new NativeSelect(null, Arrays.asList(reportTypes));
reportTypeNS.setNullSelectionAllowed(false);
reportTypeNS.setImmediate(true);
reportTypeNS.addListener(this);
...
public void valueChange(ValueChangeEvent event)
{
if (event.getProperty() == reportTypeNS)
{
// react on selected report type via event.getProperty().getValue();
...
}
}
The difference I found is, that the event listener is not always called when the selection of the NativeSelect is changed with the keyboard up/down keys. Some browsers need to press ENTER after the selection has changed.
IE9: triggers event with up/down keys (ok)
Safari 5.1.2: triggers event ONLY when ENTER is pressed after selection has changed
Chrome 16.0.912.77: triggers event ONLY when ENTER is pressed after selection has changed
Opera 11.61: triggers event with up/down keys (ok)
Firefox 9.0.1: triggers event ONLY when ENTER is pressed after selection has changed
A similar effect happens when the user pressed the ENTER key inside a TextField:
searchTF = new TextField();
searchTF.setImmediate(true);
searchTF.addShortcutListener(new AbstractField.FocusShortcut(searchTF,
ShortcutAction.KeyCode.S, ShortcutAction.ModifierKey.ALT,
ShortcutAction.ModifierKey.SHIFT));
searchTF.addListener(this);
...
public void valueChange(ValueChangeEvent event)
{
if (event.getProperty() == searchTF)
{
// react on search word via event.getProperty().getValue();
...
}
}
Here the difference is, that Opera need the TAB key pressed in order to trigger the event.
IE9: triggers event with enter keys (ok)
Safari 5.1.2: triggers event with enter keys (ok)
Chrome 16.0.912.77: triggers event with enter keys (ok)
Opera 11.61: triggers event ONLY when TextField loses focus (i.e. via TAB key)
Firefox 9.0.1: triggers event with enter keys (ok)
I don't know if this different behaviour is done on purpose, but I think it should be the same on all browsers. That's one of the main reasons why we choosed Vaadin :)
Regards
Andreas
Hi,
I recall there has been som discussion about this, and opinions vary... For the 'native' type components, one can argue that it's better that it works in the same way the user is used to, since they look 'native'. Note that most users do not switch between browsers, and are used to the way their browser of choice works.
But.
When this can make developing difficult in some situations, when you can not trust all browsers will behave the same. And this is, as you note, not what you expect from Vaadin. (And the TextField thing sounds like a bug to me.)
This is IMHO something we should take a close look at again.
Best Regards,
Marc
Marc,
thank you for your reply. I can understand the different opinions regarding the native behaviour of each browser. In my case, the content of the window will change when the value of the NativeSelect is changed. This leads to some irritating state when the window content is NOT showing what the NativeSelect is showing (when the selection is changed via keyboard and the event is not fired).
The Opera TextField behaviour is in my opinion more important. Will you file a ticket for that?
Thanks
Andreas