Describe your motivation
A PopupButton (a Button which shows a popup window with some rich layout on click) can easily be implemented via a MenuBar:
@Route("")
public class MainView extends VerticalLayout {
public MainView() {
final MenuBar menuBar = new MenuBar();
final SubMenu fooSubMenu = menuBar.addItem("Foo").getSubMenu();
final HorizontalLayout horizontalLayout = new HorizontalLayout(new Span("Popup button contents"));
horizontalLayout.add(new Button("OK", e ->
System.out.println("Clicked")));
fooSubMenu.add(horizontalLayout);
add(menuBar);
}
}The only problem is that, upon clicking on the "OK" button, the submenu stays open.
Describe the solution you'd like
It would be great to have a MenuBar.close() function which programmatically closes all open submenus. An implementation can be taken from vaadin/web-components#728 : we can simply call menuBar.getElement().executeJs("this._subMenu.close()"); from the server-side:
@Route("")
public class MainView extends VerticalLayout {
public MainView() {
final MenuBar menuBar = new MenuBar();
final SubMenu fooSubMenu = menuBar.addItem("Foo").getSubMenu();
final HorizontalLayout horizontalLayout = new HorizontalLayout(new Span("Popup button contents"));
horizontalLayout.add(new Button("OK", e -> {
System.out.println("Clicked");
close(menuBar);
}));
fooSubMenu.add(horizontalLayout);
add(menuBar);
}
private static void close(MenuBar menuBar) {
menuBar.getElement().executeJs("this._subMenu.close()");
}
}Describe alternatives you've considered
No response
Additional context
No response
Describe your motivation
A PopupButton (a Button which shows a popup window with some rich layout on click) can easily be implemented via a MenuBar:
The only problem is that, upon clicking on the "OK" button, the submenu stays open.
Describe the solution you'd like
It would be great to have a
MenuBar.close()function which programmatically closes all open submenus. An implementation can be taken from vaadin/web-components#728 : we can simply callmenuBar.getElement().executeJs("this._subMenu.close()");from the server-side:Describe alternatives you've considered
No response
Additional context
No response