0

We have a third party application (launch button only) which is always shown on top most in our application. It works fine except for modal dialogs which prevent interaction. After some digging, we noticed the style "pointer-events:none;" causes the issue. vaadin-dialog-overlay inherits the property.

enter image description here

We tried to resolve the issue by extending dialog, set pointer-events to auto when dialog is created

UI.getCurrent().getElement().getStyle().set("pointer-events", "auto");

and remove pointer-events when dialog is closed.

UI.getCurrent().getElement().getStyle().remove("pointer-events");

Unfortunately this solution works only in some cases. We also tried to change the property in openChangeListener.

Please help. We are using Vaadin 14.

Thanks you in advance.

aha
  • 33
  • 4
  • 1
    What does "works only in some cases" mean? It only works for some types of dialogs? It only works from time to time? Where in your code do you run the code (c'tor, attach, open, ...?) – cfrick Jun 05 '23 at 12:17
  • Thanks for quick response. 1. If a dialog is opened on top of a dialog. 2. open an edit form (not a dialog), and then open a dialog, in some cases it works, in some cases it does not, but if the dialog is closed and open again, it works. – aha Jun 05 '23 at 13:26
  • Is there any way to change pointer-events after dialog is loaded? – aha Jun 05 '23 at 14:36
  • if I want to set "pointer-events" to "auto" when a modal dialog is opened, what is the best place to do the setting (add code : UI.getCurrent().getElement().getStyle().set("pointer-events", "auto");)? – aha Jun 06 '23 at 15:47

1 Answers1

1

You can make it a non-modal:

Dialog dialog = new Dialog();

dialog.setModal(false);

https://vaadin.com/docs/latest/components/dialog/#modality

Oliver
  • 1,465
  • 4
  • 17