Updating style with Navigator

Hello,

So I am using Vaadin as a framework in my java web application. In my application I have a menu that allows the user to navigate on the website, some elements on the menu have submenus that get highlighted when you click on them. I am having a small styling problem when I navigate between menus, say I am performing an action on menu A, so menu A is being highlighted, from menu A I have an action button that leads me to another menu B using the method navigateTo() of navigator. However, the style does not update to highlight the new menu.

Could you please help me with this? Thanks in advance.

The AfterNavigationEvent (and its observer interface) is designed for that exact situation. See in the docs: https://vaadin.com/docs/v14/flow/routing/tutorial-routing-lifecycle.html#afternavigationevent

Olli Tietäväinen:
The AfterNavigationEvent (and its observer interface) is designed for that exact situation. See in the docs: https://vaadin.com/docs/v14/flow/routing/tutorial-routing-lifecycle.html#afternavigationevent

Thanks a lot!
So in the view I am trying to navigate to I should implement AfterNavigationEvent and the listener that’s it?

There are multiple ways to do it; if you have a Main Layout which contains the menu, it’s probably easiest to have the listener there (or, as in that documentation example, in a custom menu class like the SideMenu there). You can implement the AfterNavigationEvent in all of your views, as well, if you prefer - this is probably easiest if you inherit all of your views from a custom superclass like “AbstractView”. In the last case you’ll just need to figure out how to access the menu object; if you’re using Spring or JEE, dependency injection is the way to go.

Olli Tietäväinen:
There are multiple ways to do it; if you have a Main Layout which contains the menu, it’s probably easiest to have the listener there (or, as in that documentation example, in a custom menu class like the SideMenu there). You can implement the AfterNavigationEvent in all of your views, as well, if you prefer - this is probably easiest if you inherit all of your views from a custom superclass like “AbstractView”. In the last case you’ll just need to figure out how to access the menu object; if you’re using Spring or JEE, dependency injection is the way to go.

Thanks a lot for the help, have a great day!

Olli Tietäväinen:
There are multiple ways to do it; if you have a Main Layout which contains the menu, it’s probably easiest to have the listener there (or, as in that documentation example, in a custom menu class like the SideMenu there). You can implement the AfterNavigationEvent in all of your views, as well, if you prefer - this is probably easiest if you inherit all of your views from a custom superclass like “AbstractView”. In the last case you’ll just need to figure out how to access the menu object; if you’re using Spring or JEE, dependency injection is the way to go.

Well thank you, it was really what I’ve been looking for. However, my company is using vaadin 8 and as I see it doesn’t support the AfterNavigationEvent.

In Vaadin 8’s case, just implement the enter method of the View and do it there.