How to give focus to a TextField on a Dialog

Flow
1

Hi,

We have a text field (“searchTF”) in a Dialog.

After the dialog is opened we use …

searchTF.getElement().callJsFunction(“focus”);

In Vaadin 14.1 the user can then type and text will appear in searchTF.

PERFECT.

However testing on Vaadin 14.5 I have found that text does not appear, so that technique of passing focus to the TextField has changed?

Is there a “trick” to giving a TextField focus on a Dialog?

Any clues much appreciated.

2

Input fields extend Focusable and have a method focus() you don’t need to call JavaScript yourself

3

When do you call focus?

4

In Vaadin 14.2, there were some changes in the dialog (Dialogs can now be modeless, resizable and draggable).
I don’t know if it’s related, use the focus() method is better. You could also use the latest version of Vaadin 14 instead of a v14.5

5

Thank you gentlemen :slightly_smiling_face: That worked instantly. That particular code is ~2 years old. For long and complicated reasons (that I don’t entirely understand) we only just moved on from 14.1, but could only get as far as 14.5.5, hence I discovered that issue today. From 14.6+ localhost:8899 just comes back with “not found”. Hopefully that will not be hard to fix, but have not got to that yet. Huge thx.