Hi, you can manually manage the current menu item by using
PageLayout
https://abp.io/docs/latest/framework/ui/blazor/page-layout#menuitemname
@inject PageLayout PageLayout @code{ protected async override Task OnInitializedAsync() { PageLayout.MenuItemName = "MyApplication.MenuItemName"; } }
Hello enisn,
that's exactly what we were looking for, fast and simple, too! Thank you very much!
So if I'm understanding correctly we cannot achieve this in Lepton theme and would have to use LeptonX instead, yes?
I'm very sorry but I'm not sure I understand. Are you saying you don't have a solution to our problem in Lepton theme?
I have tested on a new project with LeptonX theme and can confirm this works.
As I have already stated in my question we are using Volo.Abp.AspNetCore.Mvc.UI.Theme.Lepton (not LeptonX). In the test project I sent you, you can see it's not working. How can we replicate the same behaviour here?
Thank you.
I've updated the framework version as you suggested. However, I'm afraid that didn't resolve my issue like it seems to have done on your end.
I see you created a new project to test for yourself. Since it seems to work in the video you shared, could you please share your code so I can have a look and see if I can find out what you've done that I haven't?
Thank you for looking into this.
It's just the default Lepton theme menu. For the test project you requested I added "My Page" and modified "Home" in order to demonstrate the issue I described.
If you click "My Page" in the navigation bar it will be highlighted (like "Home" is in your screenshot). If you click "Navigate to my page" (as seen in your screenshot) you will see the page "My Page" ( /mypage ), but there is no highlight on "My Page" in the navigation bar.
We need to have "My Page" highlighted in the navigation bar when using the " < a href='/mypage' > Navigate to my page < /a > ".
I've just sent you the email, thank you.
Hello Anjali Musmade, thank you for the response, but I think there's a misunderstanding.
Let me clarify: When using the navigation bar, the selected MenuItem is set as current. The corresponding HTML list element also receives the class "current". This is what we use to highlight the MenuItem. This behaviour is exclusive to the navigation bar. My question is: when we navigate to, say, the "Project" page using an HTML anchor element instead of the navigation bar - how do we replicate this behaviour?
When using the navigation bar to navigate, the corresponding MenuItem is set as "current".
We use custom CSS to indicate to the user which part of the application they're currently at (green underline, as seen in the images above). The user may also be redirected to a different part of the application when interacting with elements outside of the navigation bar. In that case, the corresponding MenuItem is not set as "current" (as shown in the image below).
How can this behaviour of setting a MenuItem as "current" be replicated when using other means (like HTML anchor element) to navigate to the same page?
Using the code you provided and configuring it in the module as follows works perfectly.
public override void ConfigureServices(ServiceConfigurationContext context)
{
context.Services.AddSingleton<IDynamicResourceLocalizer, MyDynamicResourceLocalizer>();
}
We can now login without a tenant to update and localize our text which will then display as expected for all tenants.
Thank you!