How to open DateField calendar by code?


I’d like to trigger the calendar view of a DateField by code.
By usecase is to show a DateFields, and when the user clicks into the exitable field (not the icon), I still want to show the calender month view.

How is that possible? Can I enfore to trigger some kind of vaadin or dom event on the datefield icon?

Unfortunately there is no server-side API for it. You could build one with a simple JavaScrtipt extension. For it, see Integrating JavaScript Components and Extensions | Client-Server Integration | Framework | Vaadin 8 Docs.

Could you assist me with this?

I tried executing a js snipped, but it does not work.

DateField date = new DateField();
    FocusListener focus = new FocusListener() {
        public void focus(FocusEvent event) {
            String js = "var ev = document.createEvent('KeyboardEvent'); ev.initKeyEvent('keydown', true, true, window, false, false, false, false, 40, 0);document.body.dispatchEvent(ev);";


Basically my setup should be fine, as when I try

String js = "alert('Hello')"; everything works as expected.

The following works (hardcoded).

But how can I get the “id” of the datefield dynamically in my javacode? Because it for sure will not be always gwt-uid-7.

                String js = "var ev = document.createEvent('KeyboardEvent');" +
                        "ev.initKeyEvent('keydown', true, true, window, true, false, false, false, 40, 0);" +