Multilevel tree drop down

Dash Python
1

I have been using Dash for couple of weeks now and I am finding it easy to configure. But, one thing I was looking is a tree structured drop down. We do have multi select option available, but for my use case a tree drop down suits the best. Any idea on how do I go about incorporating this kind of a drop down?

2

do you mean dropdown_menu in bootstrap ?:slightly_smiling_face:
https://dash-bootstrap-components.opensource.faculty.ai/l/components/dropdown_menu

3

Thank you for replying @jimmybow . More like the below:

image
image.png588×656 83.6 KB

With two levels of drill down into the options. Any method to use dropdown_menu or other dropdown to mimick the above behaviour?

1 Like
4

there is no one design that advanced component currently.:slightly_smiling_face:
maybe you can use bootstrap dropdown_menu in dropdown_menu…

5

+1 for this component. @monishaj93 how did you go?

6

Hi,

bit late to the game, but saw this message while looking for the exact same thing.
Turns out you can whip up something that is at least acceptable for a prototype app (which mine is).
Like @jimmybow pointed out (thanks for pointing me in the right direction!), you can use a dropdownmenu from the bootstrap components and it allows to put a form inside of it, in which you can add the treeview component, like so:

    dbc.DropdownMenu([
        dbc.Form([
            dbc.FormGroup([
                dash_treeview_antd.TreeView(
                    multiple=False,
                    checkable=True,
                    checked=[],
                    selected=[],
                    expanded=['0'],
                    data={
                        'title': 'Root',
                        'key': '0',
                        'children': get_root_asset_tree()
                    })
            ], row=True, className="pl-3 pr-4")
        ])

In the example, get_root_asset_tree() is just a method of mine to retrieve the entire tree.
Had to use padding classes to make it display inside the menu though.

Hope it helps anyone.

edit: guess I forgot a Form element (not verbatim code btw, I might’ve made a copypasta mistake)