Open Closed

Clear menu selection #7435


User avatar
0
ageiter created
  • ABP Framework version: v8.2.0-rc.5 / 8.1.0
  • UI Type: Blazor Server

I am using the LeptonX theme in Blazor Server and have the following problem with the menu: From my overview list I open an entry for editing, which is displayed in a separate Razor page. Unfortunately, the selection in the menu remains on the previous item. As a result, I can no longer select this menu item to return to the list (menu items that have already been selected cannot be selected a second time).

I would actually like to do the following in my edit page: PageLayout.MenuItemName = string.Empty;

But unfortunately this does not work... Is there any other way to delete the menu selection?

  1. The overview list "Terminations":

  2. Open a termination to edit:


23 Answer(s)
  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

    Hi,

    This is because there is no edit termination menu.

    You can add the breadcrumbs https://docs.abp.io/en/abp/latest/UI/AspNetCore/Page-Header#breadcrumb

  • User Avatar
    0
    ageiter created

    On the one hand, I use Blazor and not MVC. And secondly, I'm not talking about the breadcrumbs, but the normal menu. Or how did you mean exactly how I should do it?

    I know that it would work if I had an "Edit termination" menu item. But that would make no sense at all to make such a menu entry. Or can I hide it?

    There must be a way to remove the selection from the menu. It happens often that pages are shown that are not in the menu...

  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

    I can no longer select this menu item to return to the list (menu items that have already been selected cannot be selected a second time). I'm not talking about the breadcrumbs, but the normal menu. Or how did you mean exactly how I should do it?

    Yes, I know. I just mentioned the possibility of returning to the upper menu from the breadcrumbs. And

    On the one hand, I use Blazor and not MVC.

    Sorry, https://docs.abp.io/en/abp/latest/UI/Blazor/Page-Header#breadcrumb

  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

    You can try to override the MainMenuItem component

    [Dependency(ReplaceServices = true)]
    [ExposeServices(typeof(MainMenuItem))]
    public  class MyMainMenuItem : MainMenuItem
    {
        protected override void ActivateCurrentPage()
        {
            if (MenuItem.MenuItem.Url.IsNullOrEmpty())
            {
                return;
            }
    
            if (PageLayout.MenuItemName.IsNullOrEmpty())
            {
                var menuItemPath = MenuItem.MenuItem.Url.Replace("~/", string.Empty).Trim('/');
                var currentPagePath = new Uri(NavigationManager.Uri.TrimEnd('/')).AbsolutePath.Trim('/');
    
                if (menuItemPath.TrimEnd('/').Equals(currentPagePath, StringComparison.InvariantCultureIgnoreCase))
                {
                    Menu.Activate(MenuItem);
                }
            }
    
            if (PageLayout.MenuItemName == MenuItem.MenuItem.Name)
            {
                Menu.Activate(MenuItem);
            }
            else
            {
                MenuItem.Deactivate();
            }
        }
    }
    
  • User Avatar
    0
    ageiter created

    Yes, I know. I just mentioned the possibility of returning to the upper menu from the breadcrumbs.

    Ah ok, but the user will of course click on the menu link... and if nothing happens, that's not so great of course.

    You can try to override the MainMenuItem component I'm going to try that out.

    In general, the menu still has a few bugs when displaying the active item. Sometimes an item remains selected, although you are already on another item (then 2 are displayed as selected at the same time). I already complained about this problem some time ago and it would be nice if you could make a fix for it.

    It would also be useful if the page was reloaded when clicking on an already selected menu item. You said there that this would be included in the official release as a fix, which probably never happened. https://support.abp.io/QA/Questions/4397/Menu-item-that-has-already-been-selected-cannot-be-selected-again#answer-3a09668d-87cc-d807-2be2-e915eab414e7

  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

    Hi,

    Sorry, I must have forgotten, I will create an internal issue now.

  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

  • User Avatar
    0
    ageiter created

    You can try to override the MainMenuItem component

    The problem with overriding the ActivateCurrentPage()method is that it is not called when I open the edit page. Otherwise the menu would work correctly. If I am on the edit page and then press F5 for a reload, the menu shows correctly (nothing selected).

    The call from the list is made as follows: NavigationManager.NavigateTo($"/termination/{input.Id}");

    How can I ensure that ActivateCurrentPage() is also executed?

  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

    Hi,

    Leptonx subscribed to LocationChanged event inside

  • User Avatar
    0
    ageiter created

    I went through these methods step by step during debugging. And actually everything seems to be correct, for my MenuItem "Terminations" MenuItem.Deactivate() is executed and no other is activated. And yet it remained selected / activated.

    Then I added a StateHasChanged() and now it works. So it seems that the menu is not being re-rendered.

    I assume that the other menu problems also have something to do with this... it happens again and again that the status of the selection (IsActive) does not work correctly and probably only because it is not re-rendered.

    This information should be enough for a fix. Can you refund me the question?

  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

    hi,

    Because this ticket is not a bug, so I won't refund your ticket. : )

  • User Avatar
    0
    ageiter created

    ??? Not a bug ???

    I just showed you how to solve a bug in your (!) MainMenuItem and the thanks for that is that I don't even get a refund?

  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

    I am using the LeptonX theme in Blazor Server and have the following problem with the menu: From my overview list I open an entry for editing, which is displayed in a separate Razor page. Unfortunately, the selection in the menu remains on the previous item. As a result, I can no longer select this menu item to return to the list (menu items that have already been selected cannot be selected a second time).

    This is by designed

  • User Avatar
    0
    ageiter created

    I don't think you've understood what the error means.

    Short and simple: Your menu control does not always update the state of the items correctly. Sometimes already selected menu items are NOT deactivated, even though the user has been on another page for a long time. In this case, several menu items are displayed as active at the same time.

    I and others have been pointing out this problem for some time. This is not directly related to my question, but the cause is the same and so we have found the solution with my case.

    Are you going to fix this in your code or not?

  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

    Your menu control does not always update the state of the items correctly. Sometimes already selected menu items are NOT deactivated, even though the user has been on another page for a long time. In this case, several menu items are displayed as active at the same time.

    Looks like a problem, how do i reproduce the problem?

  • User Avatar
    0
    ageiter created

    Check out my entry here: https://support.abp.io/QA/Questions/6573/Top-Menu-Display-Issue#answer-3a108f96-0ab9-7cef-96bd-5a704ef89887

  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

    ok, i'm checking

  • User Avatar
    0
    ageiter created

    Sorry, I didn't realize that this part with the deactivation is not part of your code:

            else
            {
                MenuItem.Deactivate();
            }
    

    I then wanted to apply the bugfix to the other problem as well, but that didn't work. Another fix needs to be found there.

    I hope you can still improve the menu (especially TopMenu, we use this for most applications) so that the following can be done:

    1. deactivate the activated item when leaving the actual page via another way than the menu
    2. reload the page when you click again on an already active item
    3. bug with the display of active items (see other question with the videos)
  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

    Okay,

  • User Avatar
    0
    ageiter created

    Check out my entry here:
    https://support.abp.io/QA/Questions/6573/Top-Menu-Display-Issue#answer-3a108f96-0ab9-7cef-96bd-5a704ef89887

    I believe I have found the cause of this problem. But I don't have a solution yet.

    You can reproduce it like this:

    1. Use an application with TopMenu layout
    2. Select a page from the main menu (not sub menu). This will then be actively displayed in the menu.
    3. Now select a sub menu item from the menu (e.g. Administration -> Settings)
    4. Settings page is loaded, but the previously selected main menu item is still displayed as active (and the sub menu item "Settings" is not active)
    5. Reload the page (F5) and everything is correct

    I made a breakpoint in the ActivateCurrentPage() method at point 3 and saw that the PageLayout.MenuItemName there is still the old one ("TerminationList"), so this item is also activated again.

    Why does it not contain "Administration" or "SettingManagement"?

  • User Avatar
    0
    ageiter created

    Don't the administration pages overwrite this value? If not, then the value for PageLayout.MenuItemName should at least be deleted / set to String.Empty?

  • User Avatar
    0
    ageiter created

    Ok, I now know that as soon as you set PageLayout.MenuItemName, you have to remove it yourself. Otherwise the value remains until it is overwritten... This should be mentioned in the documentation, it is quite error-prone... Or even better, rethink this concept...

    I have now solved this in my page:

    protected override async Task OnInitializedAsync()
    {
        if (TerminationId != Guid.Empty)
        {
            PageLayout.MenuItemName = "None";
        }
    }
    
    protected override void Dispose(bool disposing)
    {
        PageLayout.MenuItemName = null;
        base.Dispose(disposing);
    }
    
  • User Avatar
    0
    liangshiwei created
    Support Team Fullstack Developer

    i will consider it

Made with ❤️ on ABP v8.2.0-preview Updated on March 25, 2024, 15:11