SideNav tabless panel

[alk]

Hi,

I would like to use the SideNav Webcomponent.
Checking the example they use a "classic" tab panel, which is not availible in Version 2020.09.
a) I used FormContainer "Tabless Panel" - did not work for me... - any idea?

b) I used TabPanel(with one Tab) - it worked, after changing the code for the part " add Tab from
elements.tabs.removeAllTabs();
to:
elements.tabs.removeTabAt(1);

But now I have the space for the different tabs on the tabPanel, any idea do remove this space?

Thanks
Ralf

[sean]

Hi Ralf and Happy New Year,

You are correct, the "classic" tabpanel is deprecated in favor of the tabpanel (and tabless) supplied in the bootstrap components package. However, the sidenav component is much easier than that. You don't need any tabpanel components, but rather make the sidenav component occupy the whole area that you want to have content and use the containedForm property to switch forms (best done in the onMenuItemSelected event handler)

Wiki Docs

Finally, there is a small framework which can do all this for you called SvyNavigationUX. I highly recommend this for top-level app navigation. (or at least shows a best-practaice) It can be installed through the package manager's modules section.

Wiki Docs

Good Luck!