How to show Group in the sideBar collapsed by default

Eugene commented on Nov 4

Hi, if I create a group like this

'Wine Report' => Group::create()->icon('fas fa-wine-glass-alt')->sub([
...
])

It is always (after every page reload) shown expanded - all sub items are visible - how to show it collapsed by default

KoolReport commented on Nov 5

Do you load any dashboard (sub item of group) by default Because if the sub item is selected by default then the Group will be automatically expanded to show the item that is selected. Better you can made a Home dashboard that outside of Wine Report group to host the first load of app.

Eugene commented on Nov 5

I am not sure I understood what means "selected by default" in terms of sideBar code.

I have more than 1 group in my side bar and all groups appear in expanded state,

Eugene commented on Nov 6

I have not found anything that load any of my dashboards by default so I still do not understand why do all my groups appear expanded

KoolReport commented on Nov 7

That's strange if all groups are expanded. One question that if you click to group, does it close? It work like this:

By default, the li tag of group does not have open css class, the ul inside it will close.
When clicked, the li tag will be added open css class and make the ul open.

Since we could not replicate the case, could you please try to see in inspector tool if anything went wrong.

Eugene commented on Nov 7

All li tags of my groups DO HAVE open css class in my case after the first log in. What is the reason?

screenshot

As I can see in your code you do not add anything it is made locally by js but I am confused why?

I've found this in theme.js. And it is executed every time I refresh the page

selectMenuItem: function (route) {
        //Auto select the dashboard, postion scrolling sidebar
        var alink = $("div.sidebar ul.nav a[data-name='" + route + "']");
        if (alink.hasClass("active") === false) {
            alink.addClass("active");
            if (alink.parent().parent().hasClass("nav-dropdown-items")) {
                alink.parent().parent().parent().addClass("open");
            }
        }

KoolReport commented on Nov 7

As you see the way it works. Everytime the page is loaded, base on the current route, the app will find the menu item with the route name to make active and also try to open the group that contains the item. What make me confuse is why there are more than 1 menu items having the same route name.

Could you please check the menu item tag, there is an a tag with css class "nav-link" only. The a tag contain data-name property. Please check if there is any duplicate name of menu items in different group.

Do you use the same Dashboard class in different Group without set a different name for each of them?

Eugene commented on Nov 7

Yes, the same class. I planned to use params and use it inside the same class for different data output...

But I think I can change the logic a bit to use different classes

KoolReport commented on Nov 7

Yeah, then you set different name for each of them. Such as

    "Sale For Wine" => SaleReport::create()->name("SaleForWine"),
    "Sale For Beer" => SaleReport::create()->name("SaleForBeer"),

You use the same SaleReport just different name and different params.

Eugene commented on Nov 7

Ok thank you... so long way for so simple issue :-)

thank you so much

KoolReport's Forum

How to show Group in the sideBar collapsed by default #3369

Build Your Excellent Data Report