V11.0.1 always closing subMenus

Post Reply
RalfScania
Posts: 81
Joined: 26 Sep 2012, 12:51

06 Oct 2021, 16:45

If we open a submenu in the menu, it is always closed when the subMenu is clicked.
Where and how is this handled? How can we leave the subMenu open?
Primefaces 8.0.4, MyFaces 2.2.8, Tomcat 9.0.8

merve7
Posts: 846
Joined: 12 Sep 2017, 10:44

25 Oct 2021, 14:53

Hi,
Could you please use PrimeFaces forums?

Best regards,
Merve Özçifçi

dasco144
Posts: 2
Joined: 30 Sep 2021, 10:38

26 Oct 2021, 12:25

I'm experiencing the same thing on PrimeNG 12.2/Ultima.

Is there a way to stop this behaviour?

Image

merve7
Posts: 846
Joined: 12 Sep 2017, 10:44

27 Oct 2021, 10:04

Hi,

Could you try to add routerLink to parent menuitem if it doesn't have routerLink item? Like the below code;

Code: Select all

label: 'UI Kit', icon: 'pi pi-fw pi-star', routerLink: ['/uikit'],
 items: [
       {label: 'Form Layout', icon: 'pi pi-fw pi-id-card', routerLink: ['/uikit/formlayout']},
        {label: 'Input', icon: 'pi pi-fw pi-check-square', routerLink: ['/uikit/input']},
Best regards,
Merve Özçifçi

ShipShapeDev
Posts: 2
Joined: 29 Sep 2021, 11:15

27 Oct 2021, 16:03

This is my current menu item for the maintenance root item.
I do add it dynamically based on user permissions, but this shouldn't affect the closing of the submenu right?

Code: Select all

const maintenanceMenuItem: MenuItem = {
    label: 'Maintenance',
    icon: 'pi pi-fw pi-cog',
    routerLink: ['dashboard', 'maintenance'],
    items: [
        {
            label: 'Playlists',
            icon: 'pi pi-fw pi-play',
            routerLink: [
                'dashboard',
                'maintenance',
                'playlists'
            ]
        },
        {
            label: 'Dashboards',
            icon: 'pi pi-fw pi-table',
            routerLink: [
                'dashboard',
                'maintenance',
                'dashboards'
            ]
        },
        {
            label: 'Widgets',
            icon: 'pi pi-fw pi-chart-bar',
            routerLink: [
                'dashboard',
                'maintenance',
                'widgets'
            ]
        }
    ]
};
I have tried changing the route to a single string value like your example but its the same result

merve7
Posts: 846
Joined: 12 Sep 2017, 10:44

01 Nov 2021, 10:11

Hi,

Do you check menuservice declarations and functions from your downloaded project? We update active property in some lines (app.menuitem.component.ts), if you don't update these rightly, it causes this problem.

Best regards,
Merve Özçifçi

ShipShapeDev
Posts: 2
Joined: 29 Sep 2021, 11:15

04 Nov 2021, 09:53

I've managed to find a solution to this in my project.
In menu component where you have this method

Code: Select all

updateActiveStateFromRoute() {
    this.active = this.router.isActive(this.item.routerLink[0], this.item.items ? false : true);
}
if I change it to the following:

Code: Select all

updateActiveStateFromRoute() {
    this.router.isActive(this.item.routerLink[0], this.item.items ? false : true);
}
It now works. I'm not 100% sure why.
What I have noticed is that router.isActive always returns false so it always sets the value to false.
It might possibly be because the route I'm specifying looks like this:
`dashboard/maintenance/dashboards`

but the full path of the app for that route is:
`app/dashboard/maintenance/dashboards`

My base is at /app and not exactly matching the menu items I've set up. That is why I have them as relative routes (no forward slash)
So what I think is happening is that angular is actually matching the route and applying the router link active class, instead of the app-menu-item.component.ts

merve7
Posts: 846
Joined: 12 Sep 2017, 10:44

04 Nov 2021, 13:23

Hi,

Glad to hear you found a solution.

Best regards,
Merve Özçifçi

Post Reply

Return to “Ultima - PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 2 guests