Topic: Nesting collapsibles in sidenav
Expected behavior
I would like to nest collapsibles in the sidenav but I'm unable to figure out how to do it. I would need a menu structure like this:
- travel destinations
---country 1
------region1
------region2
---country2
------region1
------region2
---country3
Actual behavior I tried nesting the li element into the ul of the .collapsible-body but in that case, the 2nd order collapsible won't open. If I put a collapsible li item instead of the ul it breaks the design.
Any help appreciated on how to do this. Thanks!
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Free
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.8.0
- Device: PC
- Browser: Chrome
- OS: Mac OS X
- Provided sample code: No
- Provided link: No
Piotr Glejzer staff commented 6 years ago
Hello, can you show me your code what did you create about that? Or you don't have it?
https://mdbootstrap.com/snippets/
RalfGlaser commented 6 years ago
Hello Piotr, thank you very much. I'm not to sure on how to embed the snippet here but I created one on: https://mdbootstrap.com/api/snippets/embed/665321 I tried several things, that was my most promising attempt. However it doesn't work since clicking on the first level opens the second, but clicking on the second level doesn't open the 3rd. Also the .rotate-icon class on the 2nd level doesn't have an effect (icon always pointing up, no animation).
Piotr Glejzer staff commented 6 years ago
Did you see our plugin about this ?
https://mdbootstrap.com/plugins/jquery/treeview/
RalfGlaser commented 6 years ago
Nope. But that should solve my problem. MDB is quite powerful. Not easy to see all the options ... Thank you very much!
Piotr Glejzer staff commented 6 years ago
Your welcome. Have a good day.