Sidebar with many entries

Webix JS
1

I have a sidebar with any folders. in one folder i have many entries and i have two problems:
firsts - in collapsed-mode i can not see all entries. scroll is not possible.

grafik
grafik270×902 24.2 KB

second - in expanded-mode i see only eight entries.

grafik
grafik335×638 22 KB

what is wrong?
THX

2

Good day,

  1. The menu in the collapsed mode has autoheight:true and no scroll by default however it can be changed: Code Snippet - here we set a fixed height for the menu.
    As another option, you coud try changing the menu height dynamically depending on the menu items count: Code Snippet .
    If there is no enough space, a maximum available number of items will be shown.
  2. You could set a scroll for the sidebar directly to see all the items: Code Snippet ( check a Tools section ).
3

Hello Mari,

Thank you for your help.
The suggestion 1 and 2 runs good for collapsed-mode but in extended-mode i have a problem with realy many items. i can not select all items with the mouse so i must first select one item and then i can with keyboard (not mouse) navigate to other items. Check the snippets.
https://snippet.webix.com/lawv2atg
https://snippet.webix.com/hvkreou8

The suggstion 3 runs good in extended-mode but not in collapsed-mode - check the snippet
https://snippet.webix.com/wt2wjw9s

But i crossed all you suggestions und used
scroll:“auto”, - for the sidebar
and
scroll:true for the menu
(menu.define({
autoheight:false,
height:216,
scroll:true,
});.

And its run perfectly! Thank you for your advice.
btw - scroll:auto for the menu were very good option for that example

THX!!!

4

Hello,

Yes, you are rightly noticed, the examples from the 1. and 2. points were for the different modes: in the expanded mode we work with the tree while in the collapsed mode the items are placed in a separate popup so each mode should be adressed in its own way.

I’m glad that that you were able to apply the solutions.