I am working on a Blazor application using DevExpress XAF (eXpressApp Framework), where I’ve integrated Razor components for my menu items. I’m facing an issue with navigation and menu item highlighting. Here’s the scenario:

Setup: I have a left-side menu implemented as Razor components in my dashboard view. When navigating from one page to another using a button click within a custom component (dashboard view), the left-side menu does not update to highlight the new menu item corresponding to the current page.

Problem: After navigating to a new page, the menu item for the previous page remains highlighted, indicating that the navigation stack or menu item highlighting isn’t updating correctly.

Expected Behavior: I expect the left-side menu to dynamically update and highlight the menu item for the current page whenever I navigate between pages using button clicks.

Attempts: I’ve attempted to use JavaScript interop to manually update the menu highlighting upon navigation, but this approach prevents me from navigating back to the previous page correctly as XAF still recognizes it as the old page.

Question: How can I ensure that the left-side menu in my XAF Blazor application dynamically updates and correctly highlights the menu item corresponding to the current page when navigating between pages via button clicks? Are there specific techniques or best practices within XAF or Blazor that I should follow to achieve this behavior?

Additional Information:

I’ve integrated Razor components for my XAF menu items.
I’m unsure of how XAF manages the navigation stack or maintains state when navigating between pages.

Code: <DxButton Click=”@(() => NavigationManager.NavigateTo(“NewWorkingHoursDashboardView”))”>GoTo Workinghours